const btn = document.querySelector('.btn');
btn.style.color = 'red';
btn.style.fontSize = '20px';
const styles = window.getComputedStyle(btn);
console.log(styles.color);

.container {
  columns: 3;
  column-gap: 20px;
}

const arr = [1, 2, 3];
const result = arr.reduceRight((acc, val) => acc + val, 0);
console.log(result);

const promise = Promise.reject('Error');
promise.catch(err => console.log('Caught'));
promise.catch(err => console.log('Again'));

.box {
  width: 100px;
  height: 100px;
  background: linear-gradient(45deg, #000 25%, transparent 25%);
  background-size: 20px 20px;
}

const num = 123.456;
console.log(num.toFixed(2), num.toPrecision(4));

const arr = ['a', 'b', 'c'];
const iterator = arr.values();
console.log(iterator.next().value, iterator.next().value);

.button {
  border: 2px solid blue;
  outline: 2px solid red;
  outline-offset: 5px;
}

const btn = document.createElement('button');
btn.textContent = 'Click';
btn.onclick = () => console.log('A');
btn.addEventListener('click', () => console.log('B'));

const arr = [1, 2, 3, 4, 5];
const first = arr.shift();
const last = arr.pop();
console.log(first + last, arr.length);

.element {
  width: 300px;
  overflow-x: auto;
  white-space: nowrap;
}