0xD34F

Как наиболее короче сделать...

Короче - не проверять, и вообще не обрабатывать элементы, где нет данных:

generalDiv.innerHTML = newCats
  .filter(n => n?.breeds.length)
  .map(({ url, breeds: [ b ] }) => `
    <div class="cat__item">
      <div class="cat__img"><img src="${url}" alt="${b.name}"></div>
      <div class="cat__name">${b.name}</div>
      <div class="cat__temperament">${b.temperament}</div>
      <div class="cat__live">${b.life_span}</div>
      <div class="cat__origin">${b.origin}</div>
      <div class="cat__description">${b.description}</div>
      <div class="cat__wikipedia_url">${b.wikipedia_url}</div>
    </div>
  `)
  .join('');

document.querySelector('form').addEventListener('input', function() {
  const sum = Array.prototype.reduce.call(
    this.querySelectorAll('input:checked'),
    (acc, n) => acc + +n.value,
    0
  );

  document.querySelector('#pSumma').innerText = `$${sum.toFixed(2)}`;
});

Правильно будет циклы в явном виде не писать:

document.querySelectorAll('.g-project__words-moving').forEach(n => {
  const html = n.querySelector('.words-moving__calm span').outerHTML.repeat(10);
  n.querySelectorAll('.running-string-wrapp').forEach(m => m.innerHTML = html);
});

Ну а если говорить об ошибке в вашем коде, то вы всегда перебираете все имеющиеся элементы .words-moving__calm span, вместо того, чтобы ограничиться только теми, которые лежат внутри текущего элемента .g-project__words-moving. Для исправления можно перенести объявление place в начало тела внешнего цикла, заменив при этом document на boxes[i].

Array.prototype.push.apply(
  arr,
  newArr.filter(n => !arr.some(m => m.id === n.id))
);

или

arr.splice(0, arr.length, ...arr
  .concat(newArr)
  .reduce((acc, n) => acc.set(n.id, acc.get(n.id) ?? n), new Map)
  .values()
);

или

newArr.forEach(function(n) {
  this.has(n.id) || (arr[arr.length] = n);
}, new Set(arr.map(n => n.id)));

const reverseNumber = num => Math.sign(num) * [...`${Math.abs(num)}`].reverse().join('');

const SHOW_MORE = 3;
const itemSelector = '.item';
const hiddenClass = 'd-none';
const hiddenSelector = `.${hiddenClass}`;
const $show = $('.show');
const $hide = $('.hide');
const $items = $(itemSelector);

function updateButtons() {
  $show.toggleClass(hiddenClass, $items.filter(hiddenSelector).length === 0);
  $hide.toggleClass(hiddenClass, $items.not(hiddenSelector).length === SHOW_MORE);
}

$show.click(function() {
  $items.filter(hiddenSelector).slice(0, SHOW_MORE).removeClass(hiddenClass);
  updateButtons();
}).click();

$hide.click(function() {
  $items.slice(SHOW_MORE).addClass(hiddenClass);
  updateButtons();
});

Убрать всех, кто не массив; заменить spread на flat:

[ arr1, arr2, arr3 ].filter(Array.isArray).flat()

fields.every(n => Object.values(n).every(m => !m.isRequired || m.value))

Так чего надо-то? Говорите "массивы", показываете объекты.

Если исходные данные, как и показано, представлены объектами, то

Object
  .entries({ defaultTest, systemTest })
  .flatMap(([ k, { references, ...n } ]) => references.map(m => ({
    ...m,
    ...n,
    [k]: true,
  })))

Если же это массивы (а сейчас показываются, соответственно, их элементы), тогда

Object
  .entries({ defaultTest, systemTest })
  .map(([ k, v ]) => v.map(({ references, ...n }) => references.map(m => ({
    ...m,
    ...n,
    [k]: true,
  }))))
  .flat(2)

Скрытый выбранный option:

const setOptions = (el, options, placeholder) =>
  el.innerHTML =
    `<option hidden selected value="">${placeholder}</option>` +
    options.map(n => `<option>${n}</option>`).join('');

https://jsfiddle.net/hb9gz7ft/1/

Проверяем число, если однозначное - возвращаем 0; в противном случае возвращаем сумму единицы и результата рекурсивного вызова:

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

<select id="event"></select>
<select id="dates"></select>

const events = [
  { name: '...', dates: [ ... ] },
  { name: '...', dates: [ ... ] },
  ...
];

const eventEl = document.querySelector('#event');
const datesEl = document.querySelector('#dates');

eventEl.innerHTML = events
  .map((n, i) => `<option value="${i}">${n.name}</option>`)
  .join('');

eventEl.addEventListener('change', function() {
  datesEl.innerHTML = events[this.value].dates
    .map(n => `<option>${n}</option>`)
    .join('');
});

eventEl.dispatchEvent(new Event('change'));

const getDuplicates = (arr, key) => Array
  .from(arr.reduce((acc, { [key]: n }) => acc.set(n, -~acc.get(n)), new Map))
  .filter(n => n[1] > 1)
  .map(n => n[0]);


const duplicates = getDuplicates(arr, 1);

или

const getDuplicates = (arr, key = n => n) => Array
  .from(arr.reduce((acc, n) => (n = key(n), acc.set(n, acc.has(n))), new Map))
  .reduce((acc, n) => (n[1] && acc.push(n[0]), acc), []);


const duplicates = getDuplicates(arr, n => n[1]);

или

const getDuplicates = arr =>
  [...arr.reduce((acc, n) => (
    acc[+acc[0].has(n)].add(n),
    acc
  ), [ new Set, new Set ])[1]];


const duplicates = getDuplicates(arr.map(n => n[1]));

Не поможет ли lodash?

const duplicates = _(arr)
  .map(n => n[1])
  .groupBy()
  .filter(n => n.length > 1)
  .map(n => n[0])
  .value();

function fib(max) {
  const next = (p1, p2) => p2 <= max ? ',' + p2 + next(p1 + p2, p1) : '';
  return 0 + next(1, 1);
}


fib(0)   // "0"
fib(1)   // "0,1,1"
fib(10)  // "0,1,1,2,3,5,8"
fib(45)  // "0,1,1,2,3,5,8,13,21,34"
fib(100) // "0,1,1,2,3,5,8,13,21,34,55,89"

Нули проставляются по таймауту, а проверка состояния выполняется немедленно. То есть, сначала вы проверяете состояние поля, а уже потом появляется выигрышная комбинация.

https://jsfiddle.net/0sodx8b7/

UPD. Если копипастить разметку и считывать настройки из атрибутов, то так: https://jsfiddle.net/0sodx8b7/1/

Последовательно:

async function processData(data) {
  const result = [];

  for (const { id, k } of data) {
    result.push(k ? await api.getData(id) : id);
  }

  return result;
}

Параллельно:

function processData(data) {
  return Promise.all(data.map(({ id, k }) => k ? api.getData(id) : id));
}

{
  in: str.match(/(?<=\[).+?(?=\])/g),
  out: str.match(/(?<=^|\])[^\[]+/g),
}

for (const arr of [ arr1, arr2 /* и т.д., можете искать в любом количестве массивов */ ]) {
  const source = arr.find(n => n.id === target.id);
  if (source) {
    Object.assign(target, source);
    break;
  }
}

Не игнорируется.

Встречный вопрос - как один элемент может находиться сразу в двух местах? Нет-нет, можете не отвечать. Очевидно же, что никак. Чтобы добавлять одинаковые элементы в разные места, делайте копии:

function render(message) {
  const p = document.createElement('p');
  p.textContent = message;
  windowChatUser1.append(p);
  windowChatUser2.append(p.cloneNode(true));
}

Или вместо создания элементов собирайте разметку:

function render(message) {
  const html = `<p>${message}</p>`;
  windowChatUser1.insertAdjacentHTML('beforeend', html);
  windowChatUser2.insertAdjacentHTML('beforeend', html);
}