0xD34F

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

Изначально доступен только первый select (остальные скрыты, неактивны, не имеют option'ов или их вообще нет).

При выборе значения в select'е все select'ы, которые расположены за ним - удаляются, скрываются, деактивируются или обнуляются. Из оставшихся извлекаются значения, которые используются для поиска массива, описывающего следующий select. Берём одно значение, ищем в массиве данных select'ов объект с соответствующим значением. Нашли - берём следующее значение и вложенный массив найденного объекта. Повторяем до тех пор, пока значения не закончатся. Последний полученный массив используется для создания или заполнения option'ами следующего select'а - если он (массив) есть и непустой. В противном случае было выбрано значение в последнем возможном select'е, можно на основе полного комплекта значений предпринять какое-то действие.

https://jsfiddle.net/uy3t4d1b/

В currentImg лежит строка. Соответственно, и при сложении тоже строка получается. То есть, номер слайда, к которому вы пытаетесь перейти, вместо 2 оказывается 11.

В качестве заплатки на скорую руку можно преобразовывать значение к числу:

this.currentImg = Math.min(+this.currentImg + 1, this.maxImages - 1);

Ну а по-хорошему - вам следует разобраться, почему там строка вместо числа, и исправить это.

$('#results').on('change', 'tr', function(e) {
  console.log(e, $(this).data('xxx'));
});

function displayLine(data) {
  $('#results').append($(`
    <tr>
      <th scope="row">${importLines.length}</th>
      <td><input class="checkbox" type="checkbox"></td>
      <td>${data[0]}</td>
      <td>${data[2]}</td>
      <td>${data[11]}</td>
      <td id="status-${data[0]}"><b><span style="color: orange">PENDING</span></b></td>
    </tr>
  `).data('xxx', data));
}

arr.propertyIsEnumerable(length)
// => true

Вы тут не свойство length проверяете, а свойство, чьё имя совпадает со значением переменной length - и что у вас в ней лежит, да хрен его знает. Может быть число, соответствующее какому-то индексу массива - тогда неудивительно, что получаете true.

UPD. Могу предположить, что за length там у вас - если вы сами её не объявляли, это window.length.

При каждом ресайзе у вас вызывается sandwitch, в котором назначается обработчик клика. Отресайзили окно 10 раз - вот вам 10 обработчиков.

Не очень понятно, зачем вообще тут нужно отслеживать ресайз - вешайте обработчик сразу, и уже внутри него проверяйте ширину окна, как-то так:

$(document).on('click', '.sandwitch', function () {
  if ($(window).width() < 520) {
    $(this).toggleClass('sandwitch--active');
    $('.main-menu-list').slideToggle();
  }
});

Ну так вы же полностью переписываете объект:

state = {
    field: newField,
    currentPlayer: newPlayer
};

Где тут свойство winnner? Не вижу. А-у-у-у, winner, ты где? Нет никого.

Может, вы хотели объект дополнить? Типа, Object.assign(state, { ... }).

function foo(...args) {
  console.log(args[N]);
}

или

function foo() {
  console.log(arguments[N]);
}

или

function foo(...{ [N]: x }) {
  console.log(x);
}

Получаем коллекцию элементов, вызываем конструктор для каждого из них:

const cards = Array.from(
  document.querySelectorAll('[data-component="card"]'),
  n => new Card(n)
);

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

constructor(el) {
  if (typeof el === 'string') {
    return Array.from(document.querySelectorAll(el), n => new Card(n));
  }

  // дальше всё по-старому

И тогда можно будет делать так:

const cards = new Card('[data-component="card"]');

Потому что при назначении обработчиков клика кнопкам вроде бы одного конкретного слайдера, на самом деле назначаете их кнопкам всех слайдеров сразу.

Подозреваю, что виноват ".parents()"

И? Никак свои подозрения проверить не попытались? Можно же было посмотреть, что parents возвращает (и чем в результате оказываются prevBtn/nextBtn). Или прочесть об этом в документации.

Меняйте его на .closest('.block') или .parent().next('.slider-btns').

const table = $(this).closest('table').DataTable();

<input type="text" value="0.00">

document.querySelector('input').addEventListener('keypress', function(e) {
  e.preventDefault();
  this.value = this.value.replace(/(0)(?!.*\1)/, e.key);
});

Запоминать последний вызов и резолвить только его?

const index = arr.findIndex(n => n.id === id);
if (index !== -1) {
  arr.splice(index, 1);
}

или, если нужен новый массив:

const newArr = arr.filter(n => n.id !== id);

Если же id имеют не уникальные значения, то создание нового массива остаётся без изменений, а модификация существующего может выглядеть так:

for (let i = arr.length; i--;) {
  if (arr[i].id === id) {
    arr.splice(i, 1);
  }
}

или так (да, reduceRight используется не совсем по назначения, как и оператор &&):

arr.reduceRight((_, n, i, a) => n.id === id && a.splice(i, 1), null);

или так:

let countDeleted = 0;

for (let i = 0; i < arr.length; i++) {
  arr[i - countDeleted] = arr[i];
  countDeleted += arr[i].id === id;
}

arr.length -= countDeleted;

или так:

arr.splice(0, arr.length, ...arr.filter(n => n.id !== id));

<input type="range" min="20" max="200" value="100">
<img src="...">

document.querySelector('input').addEventListener('input', function() {
  document.querySelector('img').style.filter = `brightness(${this.value}%)`;
});

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

$(this).closest('tr').index()

В обработчике start это будет индекс перемещаемого элемента; в drop, соответственно - куда переместили.

$('.box').each((i, n) => {
  const $blocks = $('.section .block', n);
  $('.imgs img', n).each((i, n) => $blocks.eq(i).append(n));
});

или

document.querySelectorAll('.box').forEach(n => {
  const images = n.querySelectorAll('img');
  n.querySelectorAll('.block').forEach((n, i) => n.append(images[i]));
});

Подменяете экземпляр класса другим объектом. Вот это вот из конструктора следует убрать:

return this.data();

const chunked = (data, chunkSize) =>
  Array.prototype.reduce.call(
    data,
    (acc, n, i) => (
      i = i / chunkSize | 0,
      (acc[i] = acc[i] || []).push(n),
      acc
    ),
    []
  );


console.log(chunked([...Array(10).keys()], 3));
console.log(chunked('ABCDEFG', 2));
console.log(chunked(document.querySelectorAll('img'), 5));

Потому что ошибка. Потому что пытаетесь прочитать свойство у undefined. Получаете udnefined потому что дергаете несуществующий элемент массива. Потому что цикл делает итераций больше, чем в массиве элементов. Потому что вместо длины массива слов сравниваете значение счётчика цикла с длиной строки, из которой слова нарезали.

Меняйте

for (let i = 0; i < answer.length - 1; i++)

на

for (let i = 0; i < words.length; i++)

UPD. https://jsfiddle.net/h0xm9ysc/

Ну так наверное надо стили элементу задавать, а не строкам: p.style.color = colors[i].