0xD34F

Достаточно добавить один символ... Или убрать. Вот здесь:

if (item.innerText === currentPage) {

Одно значение является строкой, другое числом. Число строке не может быть равно. Так что или выполняйте сравнение с приведением типов:

item.innerText == currentPage

Или превращайте строку в число явным образом:

+item.innerText === currentPage

Это если по-быстрому исправить то, что есть. Но вообще, я бы всё переписал:

document.body.insertAdjacentHTML('beforeend', `
  <div class="container">
    <table>
      <thead>
        <tr>${keys.map(k => `
          <th>${k}</th>`).join('')}
        </tr>
      </thead>
      <tbody></tbody>
    </table>
    <div class="pagination"></div>
  </div>
`);

const tableEl = document.querySelector('.container table');
const paginationEl = document.querySelector('.container .pagination');

paginationEl.addEventListener('click', ({ target: t }) =>
  t.matches('a') && showPage(+t.textContent)
);

function showPage(page) {
  paginationEl.innerHTML = Array
    .from(
      { length: Math.ceil(data.length / rows) },
      (_, i) => `<a${-~i === page ? ' class="active"' : ''}>${-~i}</a>`)
    .join('');

  tableEl.tBodies[0].innerHTML = data
    .slice(~-page * rows, page * rows)
    .map(n => `
      <tr>${keys.map(k => `
        <td>${n[k]}</td>`).join('')}
      </tr>`)
    .join('');
}

showPage(1);

погуглите, что такое комплексные числа

Нет такого атрибута - transform. Это должно быть свойство style:

:style="{ transform: computedMatrix }"

Запятую добавьте: for i, in [[1],[2]]:.

Кого надо проверить: const $inputs = $('.input_1');.

Проверяем:

Array.from($inputs).forEach(n => console.log(n, n.value ? 'я заполнен' : 'я пуст'));

console.log($inputs.get().some(n => n.value) ? 'кто-то заполнен' : 'все пустые');

console.log($inputs.toArray().every(n => n.value) ? 'все заполнены' : 'кто-то пуст');

console.log(Array.prototype.filter.call($inputs, n => n.value), 'мы заполнены');

console.log([...$inputs.not((i, n) => n.value)], 'мы пустые');

const groupedArr = useMemo(() => {
  return Object.values(arr.reduce((acc, { dt, weather }) => {
    const [ date, time ] = dt.split(' ');
    acc[date] = acc[date] || { date, weather: [] };
    acc[date].weather.push({ time, weather });
    return acc;
  }, {}));
}, [ arr ]);

<ul>{groupedArr.map(n => (
  <li>
    <h3>{n.date}</h3>
    <ul>{n.weather.map(m => (
      <li>
        {m.time} - {m.weather}
      </li>))}
    </ul>
  </li>))}
</ul>

function getDateInTimeZone(utcOffset, date = new Date()) {
  const utcTime = date.getTime() + date.getTimezoneOffset() * 60000;
  return new Date(utcTime + utcOffset * 3600000);
}


const moscowDate = getDateInTimeZone(3);
const newYorkDate = getDateInTimeZone(-5);
const tokyoDate = getDateInTimeZone(9);

Это конечно круто - публиковать код, не говоря при этом ни слова о том, что он делает, и просить найти в нём косяки. Поступлю симметрично: вот вам код рабочий - сравнивайте со своим, думайте:

const digital_root = num => num > 9
  ? digital_root([...`${num}`].reduce((acc, n) => acc + +n, 0))
  : num;

re.sub('^\d*\n*|\n*\d*$', '', s)

^(?=.*[a-z])[\da-z][\w.]+$

<i v-for="i in 5" :class="[ i <= stars ? 'fas' : 'far', 'fa-star' ]" />

почему 14 часов превратились в 02

Потому что 14 часов - это 2 часа в 12-часовом формате.

как этого избежать?

Указать 24-часовой формат. Замените h на H.

анимируется

UPD. Animatable CSS properties.

preg_match_all('/\b[а-яё]+\b/ui', $str, $cyrillic);
preg_match_all('/\b[a-z]+\b/i', $str, $latin);

погуглите colspan

Всем элементам добавляете общий класс menu__item, ну и вперёд:

.opacity {
  opacity: 0.4;
}

const $items = $('.menu__item')
  .mouseenter(e => $items.not(e.target).addClass('opacity'))
  .mouseleave(e => $items.removeClass('opacity'));

options: {
  tooltips: {
    callbacks: {
      label({ index }, { datasets: [ { data } ], labels }) {
        const percent = 100 * data[index] / data.reduce((acc, n) => acc + n, 0);
        return `${labels[index]}: ${percent.toFixed(1)}%`;
      },
    },
  },
},

const getNested = (obj, ...keys) => keys
  .flat(Infinity)
  .flatMap(n => typeof n === 'string' ? n.split('.') : n)
  .reduce((p, c) => p?.[c] ?? null, obj);

getNested(data, [ 'hosts', 1, null ]) // 3
getNested(data, 'hosts', 0) // {name: 'web1'}
getNested(data, 'hosts.0.name.2') // 'b'
getNested(data, [ 'user', 'xxx' ]) // null
getNested([], 'constructor.prototype', [[['slice']]], ['name.length']) // 5

Получаем список ключей, перебираем, кто не равен чему надо - удаляем:

Object.keys(obj).forEach(n => n !== key && delete obj[n]);

Конечно, было бы проще создавать новый объект с нужным ключом:

obj = { [key]: obj[key] };

Но вообще, почему надо ограничиваться лишь одним ключом?

Удаляем ключи существующего объекта кроме указанных:

const deleteKeys = (obj, except) =>
  Object.keys(obj).forEach(n => except.includes(n) || delete obj[n]);


const obj = { a: 1, b: 2, c: 3, d: 4 };
deleteKeys(obj, [ 'a' ]);
console.log(obj); // {a: 1}

Собираем копию объекта, где будут отсутствовать ключи кроме указанных:

const pick = (obj, keys) =>
  Object.fromEntries(keys.map(n => [ n, obj[n] ]));


const obj = { a: 1, b: 2, c: 3, d: 4 };
console.log(pick(obj, [ 'a', 'd' ])); // {a: 1, d: 4}

По наличию какого класса будем опознавать элементы, которые должны быть подвергнуты суммированию; куда надо записывать сумму; и как эту сумму посчитать:

const className = 'select';
const sumEl = document.querySelector('.sum');
const sum = elements =>
  Array.prototype.reduce.call(
    elements,
    (acc, n) => acc + (+n.value || 0),
    0
  );

Делегирование, назначаем обработчик события change один раз:

const updateSum = () => sumEl.textContent = sum(document.getElementsByClassName(className));
document.addEventListener('change', e => e.target.classList.contains(className) && updateSum());
updateSum();

Или, назначаем обработчик каждому элементу индивидуально:

const selects = document.querySelectorAll(`.${className}`);
const updateSum = () => sumEl.innerText = sum(selects);
selects.forEach(n => n.addEventListener('change', updateSum));
updateSum();