0xD34F

Во-первых - всё срабатывает. Попытайтесь осознать разницу между "не срабатывает" и "срабатывает не так, как ожидается".

Во-вторых - обработчик остаётся висеть потому, что вы передаёте в removeEventListener не то, что передавали в addEventListener. Смотрите сами:

document.addEventListener('click', clickerOut(parent));

document.removeEventListener('click', clickerOut);

clickerOut(parent) и clickerOut - это что по-вашему, одно и то же? Никак нет.

Исправляем:

function clickerOut(parent) {
  return function handler(e) {    
    ...
    document.removeEventListener('click', handler);
  }
}

Формат данных конечно просто ублюдочный.

Сперва соберём нормальный массив объектов вместо этого позорища:

const arr = Object
  .entries(obj)
  .reduce((acc, [ k, v ]) => (
    k = k.match(/([a-z]+)(\d+$)/),
    (acc[k[2]] ??= {})[k[1]] = v,
    acc
  ), []);

Затем посчитаем, у кого чего сколько:

const os = Object.fromEntries(arr.map(n => [ n.system, 0 ]));
const count = arr.reduce((acc, n) => ((acc[n.name] ??= { ...os })[n.system]++, acc), {});

Ну и выведем результаты:

console.log(Object
  .entries(count)
  .map(n => `${n[0]}: ${Object.entries(n[1]).map(m => m.join(' - ')).join(', ')}`)
  .join('\n')
);

От того, что вы удалили класс, обработчик события никуда не девается.

Сделайте однократно срабатывающий обработчик события:

$('.el1--closed').one('click', function() {
  $(this)
    .siblings()
    .slideToggle();
});

Или, вешайте делегированный обработчик:

$('.block').on('click', '.el1--closed', function() {
  $(this)
    .removeClass('el1--closed')
    .siblings()
    .slideToggle();
});

arr.reduce((acc, n) => {
  const { x, y } = acc[acc.length - 1] || {};
  for (let i = 1; n.x - x - i >= 1; i++) {
    acc.push({ x: `${+x + i}`, y });
  }

  acc.push({ ...n });

  return acc;
}, [])

кнопка будет disabled, если все три поля input будут пустые и наоборот, если все поля заполнены, то кнопка станет enabled

А если поля заполнены, но не все - одно или два? Это получается какое-то третье состояние, которого у кнопки быть не может. Вам следует больше внимания уделять формулировкам стоящих перед вами задач. "Наоборот" для "все пустые" - это "хотя бы одно заполнено":

const button = document.querySelector('селектор кнопки');
const inputs = [...document.querySelectorAll('селектор инпутов')];
const onInput = () => button.disabled = inputs.every(n => !n.value);
inputs.forEach(n => n.addEventListener('input', onInput));
onInput();

И, аналогично, для "все заполнены" - "хотя бы одно пустое", вместо every будет some.

$('.cart_qty').change(({ target: t }) => {
  $(t)
    .closest('селектор блока с товаром')
    .find('.shopcart__item-total')
    .text(function() {
      return t.value * this.dataset.price;
    });
});

или

document.querySelectorAll('.cart_qty').forEach(n => n.addEventListener('change', onChange));

function onChange({ target: t }) {
  const total = t.closest('селектор блока с товаром').querySelector('.shopcart__item-total');
  total.innerText = t.value * total.dataset.price;
}

О каком массиве идёт речь, через какой промежуток надо получать его элементы и что с ними делать:

const options = [
  [ 'hello, world!!', 'fuck the world', 'fuck everything' ],
  500,
  console.log,
];

Можно установить интервал:

function interval(arr, delay, callback) {
  let i = -1;

  return arr.length
    ? setInterval(() => callback(arr[i = -~i % arr.length]), delay)
    : null;
}


const intervalId = interval(...options);
// надо остановить хождение по кругу, делаем так: clearInterval(intervalId);

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

function interval(arr, delay, callback) {
  let timeoutId = null;

  arr.length && (function step(i) {
    timeoutId = setTimeout(() => {
      callback(arr[i]);
      step((i + 1) % arr.length);
    }, delay);
  })(0);

  return () => clearTimeout(timeoutId);
}


const stop = interval.apply(null, options);
// надо остановить, делаем так: stop();

Перебрать элементы, выдернуть оттуда нужные данные, склеить в строку:

Array.from(navigator.plugins, n => n.name).join(', ')

Потому что кто-то не понимает разницы между собственно функцией и результатом её вызова. Вот же позорище.

Оборачивайте вызов функции в другую функцию. Или bind используйте. Или разберитесь, что принимают обработчики событий в качестве параметра, и перепишите функцию так, чтобы не надо было ей передавать элементы btnNextLevel.

function xxx(key) {
  let val = entityTree[key];
  const nextKey = Array.isArray(val) && (val = [...val], val.pop());
  return val ? [].concat(key, val, xxx(nextKey)) : [];
}

/[А-ЯЁ ]/i.test(str)

if (obj.hasOwnProperty(key)) {
  if (!Array.isArray(obj[key])) {
    obj[key] = [ obj[key] ];
  }

  obj[key].push(val);
} else {
  obj[key] = val;
}

UPD. Вынесено из комментариев:

это для массива, а у меня объект

И что? Самостоятельно одно на другое заменить - нет, никак? Вместо Array.isArray проверяйте instanceof Object. А ключ нового свойства - это количество уже существующих свойств:

if (obj.hasOwnProperty(key)) {
  if (!(obj[key] instanceof Object)) {
    obj[key] = { 0: obj[key] };
  }

  obj[key][Object.keys(obj[key]).length] = val;
} else {
  obj[key] = val;
}

for (let i = times.length; i--;) {
  const d = new Date(times[i]);
  if (d <= date) {
    result.children[i].classList.add('active');
    result.children[i + 1]?.classList.add('next');
    break;
  }
}

Непонятно, что конкретно надо. Варианты-то разные есть. Например:

1. Один из элементов services должен содержать все категории, указанные в filterBy:
   
   

   users.filter(u => u.services.some(s => filterBy.every(f => s.categories.includes(f))))

   
   
2. Должны присутствовать все категории, указанные в filterBy, но распределены по элементам services они могут быть произвольным образом:
   
   

   users.filter(u => filterBy.every(f => u.services.some(s => s.categories.includes(f))))

   
   
3. Достаточно присутствия любой из категорий, указанных в filterBy, в любом из элементов services:
   
   

   users.filter(u => filterBy.some(f => u.services.some(s => s.categories.includes(f))))

   
   

и т.д.

$('.products').append(data.uslugi.map(item => `
  <div class="item p-2">
    <img src="${item.img}" alt="" class="p-2 h-64 mx-auto">
    <h2 class="text-lg text-center font-semibold p-1 pb-0">${item.title}</h2>
    <div class="flex flex-wrap w-56 mx-auto py-2 pt-0 text-lg sizes">
      ${item.size.map(size => `
        <div class="p-1 flex size">
          <span class="px-2 rounded-full size active">${size}</span>
        </div>
      `).join('')}
    </div>
  </div>
`).join(''))

const form = document.querySelector('.form');
const items = [...form.querySelectorAll('.form__item')];

form.addEventListener('change', function(e) {
  const index = items.indexOf(e.target.closest('.form__item'));
  form.querySelector('.form__progress-line').style.width = (index + 2) * 100 / items.length + '%';

  setTimeout(() => {
    items[index]?.classList.remove('form__item--active');
    items[index + 1]?.classList.add('form__item--active');

    if (index + 1 === items.length) {
      form.style.display = 'none';
      document.querySelector('.result').classList.add('result--active');
    }
  }, 1000);
});

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

Заменить id на классы:

const values = Array.from(document.querySelectorAll('.l'), n => n.value);
document.querySelectorAll('.lt').forEach((n, i) => n.value = values[i]);
document.querySelector('.block').style.borderRadius = values.map(n => `${n}px`).join(' ');

Никак. То, чего вы хотите, moment делать не умеет. Есть fromNow - но там не всё гладко (например, секунды отображаются неточно - вместо количества пишет "несколько" или округляет до минуты). Может, есть какой плагин, но это не точно и надо искать.

Ваш вариант - это вот что.

$(window).scroll(function() {
  const $banner = $('.banner');
  const bannerHeight = $banner.outerHeight(true);
  const bannerTop = parseInt($banner.css('top'), 10);
  const windowTop = $(this).scrollTop();

  $banner.toggleClass('hide', $('.fullwidth').get().some(n => {
    const $n = $(n);
    const nTop = $n.offset().top - bannerTop;
    const minTop = nTop - bannerHeight;
    const maxTop = nTop + $n.outerHeight(true);

    return windowTop > minTop && windowTop < maxTop;
  }));
});

const join = val => Array.isArray(val) ? val.map(join).join('') : val;

или

const join = arr => ''.concat(...arr.flat(Infinity));

или

const join = arr => arr.reduce((acc, n) => acc + (n instanceof Array ? join(n) : n), '');

или

function join(arr) {
  const result = [];

  for (const stack = [ arr ]; stack.length;) {
    const n = stack.pop();
    if (n?.constructor === Array) {
      stack.push(...[...n].reverse());
    } else {
      result.push(n);
    }
  }

  return result.join``;
}