0xD34F

const data = Array
  .from(document.querySelectorAll('.js-input input'))
  .reduce((acc, n) => {
    const keys = n.name.match(/(?<=\[)\w+(?=\])/g);
    const key = keys.pop();
    keys.reduce((p, c) => p[c] = p[c] || {}, acc)[key] = n.value;
    return acc;
  }, {});

При моей структуре достать его через css не получится наверное? (да/нет?)

получится, если разместить input'ы перед label'ами

т.к. объектов много (~2000) при очистке фильтра страница подлагивает

Пагинацию сделайте - вместо двух тысяч будет отображаться одновременно несколько десятков.

Да и вообще, заставлять пользователей созерцать тысячи объектов, вне зависимости от скорости отрисовки - само по себе неправильно. Не может человек столько информации воспринять за один раз.

const videos = document.querySelectorAll('video');
const onPlay = e => videos.forEach(n => n !== e.target && n.pause());
videos.forEach(n => n.addEventListener('play', onPlay));

const $elements = $('здесь селектор ваших элементов');
const updateElement = i => $elements.eq(i).addClass('здесь ваш класс');
const delay = 500;

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

$elements.each(i => setTimeout(updateElement, (i + 1) * delay, i));

Или время задержки у всех одинаковое, таймауты назначаются поочерёдно - следующий запускается из коллбека предыдущего:

(function next(i) {
  if (i < $elements.length) {
    setTimeout(() => {
      updateElement(i);
      next(-~i);
    }, delay);
  }
})(0);

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

const intervalID = setInterval(
  i => updateElement(++i[0]).length || clearInterval(intervalID),
  delay,
  [ -1 ]
);

const str = arr
  .map(n => `${n.charAt(0).toUpperCase()}${n.slice(1)}`)
  .join(', ');

// или

const str = arr.reduce((acc, n, i) => {
  return acc + (i ? ', ' : '') + n.replace(/./, m => m.toUpperCase());
}, '');

// или

const str = ''.concat(...arr.flatMap(([ c = '', ...n ], i) => {
  return [ i ? ', ' : '', c.toUpperCase(), ...n ];
}));

+str.replace(/.+img-(?=\d)|\D+$/g, '')

или

str.match(/(?<=img-)\d+/) | 0

или

parseInt(str.split('/img-').pop())

есть массив индексов [0, 3, 1, empty, 2]
<...>
должно быть - [100, 400, 200, empty, 300]

Что, вот прям так - empty? Ну, держите:

for (let i = 0; i < indexes.length; i++) {
  if (indexes.hasOwnProperty(i)) {
    arr.push(arr[indexes[i]]);
  } else {
    arr.length++;
  }
}
arr.splice(0, arr.length - indexes.length);

Если отказаться от этого идиотизма с empty (пусть в массиве индексов будет что-то не числовое, null например; а в исходный массив подставляться будет undefiend, соответственно), то

arr.splice(0, arr.length, ...indexes.map(i => arr[i]));

https://codepen.io/anon/pen/PryVPj?editors=1010

UPD. https://jsfiddle.net/y2aL36rp/

О каком классе идёт речь: const className = 'carusel__item_active';.

Как проверить, что элемент имеет класс:

const hasClass = el => el.classList.contains(className);
// или
const hasClass = el => el.matches(`.${className}`);
// или
const hasClass = el => el.className.split(' ').includes(className);
// или
const hasClass = el => RegExp(`(^| )${className}( |$)`).test(el.classList.value);

Получаем элемент:

const activeSlide = Array.prototype.find.call(items, hasClass);

// или

let activeSlide = null;
for (const n of items) {
  if (hasClass(n)) {
    activeSlide = n;
    break;
  }
}

// или

const [ activeSlide ] = [...items].filter(hasClass);

// или

let activeSlide = null;
for (let i = 0; i < items.length && !activeSlide; i++) {
  activeSlide = hasClass(items[i]) ? items[i] : activeSlide;
}

// или

let activeSlide = items[0];
while (activeSlide && !hasClass(activeSlide)) {
  activeSlide = activeSlide.nextElementSibling;
}

// или

const activeSlide = (function get(i, n = items.item(i)) {
  return (!n || hasClass(n)) ? n : get(-~i);
})(0);

function onMarkerClick(e) {
  map.setZoom(8);
  map.panTo(e.latLng);
}


for (const f of features) {
  const marker = new google.maps.Marker({
    position: f.position,
    icon: icons[f.type].icon,
    map,
  });
  marker.addListener('click', onMarkerClick);
}

const input = document.querySelector('input');
const buttons = document.querySelectorAll('button');
buttons.forEach(n => n.addEventListener('click', onClick));

Можно сложить в массив информацию о том, какой класс какому id соответствует:

const classes = [
  [ 'id1', 'class1' ],
  [ 'id2', 'class2' ],
  [ 'id3', 'class3' ],
];

function onClick() {
  classes.forEach(n => input.classList.toggle(n[1], n[0] === this.id));
}

Или добавить кнопкам атрибут, который будет содержать имя класса (id кнопкам в этом случае уже не нужны):

<button data-class="class1">click me</button>
<button data-class="class2">click me</button>
<button data-class="class3">click me</button>

function onClick() {
  buttons.forEach(n => input.classList.toggle(n.dataset.class, n === this));
}

const count = (max, timeout) =>
  (function next(i) {
    if (i <= max) {
      setTimeout(() => {
        console.log(i);
        next(++i);
      }, timeout(i));
    }
  })(0);


count(100, i => i * 5);

Ищем готовое или реализовываем самостоятельно:

function debounce(f, delay) {
  let timeoutId = null;

  return function() {
    clearTimeout(timeoutId);
    timeoutId = setTimeout(() => f.apply(this, arguments), delay);
  };
}

function throttle(f, delay) {
  let lastCall = -Infinity;

  return function() {
    const now = +new Date;
    if (now - lastCall > delay) {
      lastCall = now;
      return f.apply(this, arguments);
    }
  };
}

Как вычислить сумму для одного элемента - очевидно же, умножаем количество на цену:

const getItemSum = item => item.count * item.price;

Дальше надо перебрать массив и сложить суммы каждого. Перебирать массив можно по-разному.

Например, цикл в явном виде:

let sum = 0;
for (let i = 0; i < data.length; i++) {
  sum = sum + getItemSum(data[i]);
}

// или

let sum = 0;
for (const n of data) {
  sum += getItemSum(n);
}

Или, в неявном, с помощью методов массива:

const sum = data.reduce((acc, n) => acc + getItemSum(n), 0);

// или

const sum = eval(data.map(getItemSum).join('+')) || 0;

Или, рекурсия:

const sum = (function getSum(i, n = data[i]) {
  return n
    ? getItemSum(n) + getSum(i + 1)
    : 0;
})(0);

Object.values(tasks.reduce((acc, { user: { id, name }, ...n }) => {
  (acc[id] = acc[id] || { user: { id, name, tasks: [] } }).user.tasks.push(n);
  return acc;
}, {}))

Это [object Object], дефолтное строковое представление объектов. Если первый аргумент, переданный в JSON.parse, не является строкой, он будет в строку преобразован. Вы пытаетесь распарсить объект. Нет необходимости использовать JSON.parse, всё уже как надо.

const pick = (obj, keys) =>
  keys.reduce((acc, n) => (acc[n] = obj[n], acc), {});

const newObj = pick(obj, [ 'username', 'age' ]);

или

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

const newObj = pick(obj, 'username', 'age');

Крутое у вас там условие в цикле:

1 < imageData.data.length

Может, всё-таки не 1, а i?

const selectors = {
  wrapper: '.numberQut',
  input: '.qut',
  minus: '.minusQus',
  plus: '.plusQus',
};

const limits = {
  min: 1,
  max: 5,
};

const updateValue = (el, change = 0) =>
  el.value = Math.min(limits.max, Math.max(limits.min, (parseInt(el.value) || 0) + change));

document.addEventListener('click', ({ target: t }) => {
  const change = +t.matches(selectors.plus) || -t.matches(selectors.minus);
  if (change) {
    updateValue(t.closest(selectors.wrapper).querySelector(selectors.input), change);
  }
});

document.addEventListener('input', ({ target: t }) => {
  if (t.matches(selectors.input)) {
    updateValue(t);
  }
});