0xD34F

filterBox.forEach(n => {
  n.classList.toggle('none', ![ 'all', n.dataset.work ].includes(filterBtn));
});

Где элементы находятся, что за элементы, какой класс надо им переключать:

const container = document.querySelector('.side__nav');
const itemSelector = 'li';
const activeClass = 'is-active';

Переключаем:

container.addEventListener('click', function(e) {
  const item = e.target.closest(itemSelector);
  if (item) {
    this.querySelector(`${itemSelector}.${activeClass}`)?.classList.remove(activeClass);
    item.classList.add(activeClass);
  }
});

или

const items = container.querySelectorAll(itemSelector);
const onClick = e => items.forEach(n => n.classList.toggle(activeClass, n === e.currentTarget));
items.forEach(n => n.addEventListener('click', onClick));

Если заранее известно только значение атрибута:

const element = document.querySelector(`.js-filter-wrap a[data-filter="${конкретноеЗначение}"]`);
if (element) {
  ...

Или, если уже есть коллекция элементов, в которой надо найти подходящий:

const element = [...elements].find(n => n.dataset.filter === конкретноеЗначение);
if (element) {
  ...

1. Собрать из вложенных массивов один общий
   
2. Отсортировать полученный массив
   
3. Взять сколько надо первых/последних (зависит от направления сортировки) элементов
   

const result = arr
  .flatMap(n => n.subcategories)
  .sort((a, b) => a.rating - b.rating)
  .slice(-2);

Там, внутри самой спецификации, всё объясняется:

1. Internal Methods and Internal Slots:
   
   

   Internal methods and internal slots are identified within this specification using names enclosed in double square brackets...

   
   
2. Well-Known Symbols:
   
   

   Within this specification a well-known symbol is referred to by using a notation of the form @@name...

   
   
3. Well-Known Intrinsic Objects:
   
   

   Within this specification a reference such as %name% means the intrinsic object...

   
   

let displayMessage = '';
doItems.forEach((item, i) => {
    displayMessage += `
    <li class="do__item">
        <input type="checkbox" id="do_${i}" ${item.checked ? 'checked': ' '}>
        <label for="do_${i}" class="${item.checked ? 'checked' : ' '}">${item.message}</label>
        <button class="remove" id="do_${i}">Delete</button>
    </li>`;
    block.innerHTML = displayMessage;
});

Установка значения block.innerHTML должна производиться после forEach'а, а не внутри.

UPD. Кстати, а какого хрена у вас элементы с одинаковыми id (input и button)?

Определяете максимальное расстояние от курсора, на котором элементы должны начинать движение. По событию mousemove на родителе считаете расстояния до элементов (теорема Пифагора), тем, кто достаточно близко, задаёте translate. Чтобы смена положения была плавной, в стилях определяете transition для translate'а.

https://jsfiddle.net/w6jf480k/1/

Вставить - никак. Строки в js изменять нельзя. Можно сделать новую:

const insert = (str, index, substr) =>
  str.replace(RegExp(`(?<=.{${index}})`), substr);

// или

const insert = (str, index, substr) =>
  str.replace(RegExp(`.{${index}}`), `$&${substr}`);

// или

const insert = (str, index, substr) =>
  str.length >= index ? str.slice(0, index) + substr + str.slice(index) : str;

Радиокнопкам добавить data-атрибут, который будет содержать значение для плейсхолдера:

<input type="radio" name="method" data-placeholder="hello, world!!">
<input type="radio" name="method" data-placeholder="fuck the world">
<input type="radio" name="method" data-placeholder="fuck everything">

Как передать это значение из радиокнопки в инпут:

const updatePlaceholder = (input, radio) =>
  input.placeholder = radio.dataset.placeholder;
  // или
  // input.setAttribute('placeholder', radio.getAttribute('data-placeholder'));
  // input.attributes.placeholder.value = radio.attributes['data-placeholder'].value;

По событию change, имеющим своим источником радиокнопку, надо получить инпут, находящийся внутри той же формы. Можно от радиокнопки подняться к форме, внутри которой уже искать инпут. Или просто пройти по ссылкам - из радиокнопки в форму, которой она принадлежит, из коллекции элементов формы получить инпут по его имени.

Обработчик события change можно сделать делегированным:

document.addEventListener('change', ({ target: t }) => {
  if (t.matches('input[name="method"]')) {
    updatePlaceholder(t.closest('form').querySelector('[name="wallet"]'), t);
  }
});

Или назначать каждой радиокнопке индивидуально:

const onChange = ({ target: t }) =>
  updatePlaceholder(t.form.elements.wallet, t);

for (const form of document.forms) {
  for (const radio of form.elements.method) {
    radio.addEventListener('change', onChange);
  }
}

$.param($(this).serializeArray().filter(n => +n.value && n.name !== 'mode'))

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

const buttonOpenSelector = '.project__zoom';
const buttonCloseSelector = '.overlay--close';
const contentSelector = '.overlay--gallery';
const key = 'gallery';
const attr = `data-${key}`;
const activeClass = 'overlay--active';

Вот jquery:

$(document)
  .on('click', buttonOpenSelector, function() {
    $(`${contentSelector}[${attr}="${$(this).data(key)}"]`).addClass(activeClass);
  })
  .on('click', buttonCloseSelector, function(){
    $(this).closest(contentSelector).removeClass(activeClass);
  });

А вот jquery нет:

document.addEventListener('click', ({ target: t }) => {
  t
    .closest(buttonCloseSelector)
    ?.closest(contentSelector)
    .classList
    .remove(activeClass);

  (t = t.closest(buttonOpenSelector)) && document
    .querySelector(`${contentSelector}[${attr}="${t.dataset[key]}"]`)
    .classList
    .add(activeClass);
});

str.replace(/(\+\d)(\d{3})\d{5}/, '$1 ($2) ***-**-')

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

Во-первых, чтобы результирующий массив был непустым, надо, как минимум, из коллбека фильтрации что-то возвращать. При использовании map'а - тоже. Кстати, а зачем map? Непонятно. Возможно, вместо него нужен some.

Во-вторых - в dataset лежат строки, сравниваете их вы с числами. Без приведения типов. Очевидно, что результаты подобных проверок всегда будут ложными.

/(?=.*\d\d)^\D.{5,}$/

На что надо заменить повторяющиеся элементы: const newValue = '!!!';.

Собираем новый массив:

const count = arr.reduce((acc, n) => (acc[n] = (acc[n] ?? 0) + 1, acc), {});
const newArr = arr.map(n => count[n] > 1 ? newValue : n);

// или

const newArr = arr.map(function(n) {
  return this.get(n) ? newValue : n;
}, arr.reduce((acc, n) => acc.set(n, acc.has(n)), new Map));

// или

const newArr = arr.map((n, i, a) => a.indexOf(n) !== a.lastIndexOf(n) ? newValue : n);

Обновляем существующий:

arr.forEach(function(n, i, a) {
  a[i] = ~-this.get(n) ? newValue : n;
}, arr.reduce((acc, n) => acc.set(n, -~acc.get(n)), new Map));

// или

const duplicates = arr.reduce((acc, n) => (acc[n] = acc.hasOwnProperty(n), acc), {});
arr.splice(0, arr.length, ...arr.map(n => [ n, newValue ][+duplicates[n]]));

// или

Object
  .values(arr.reduce((acc, n, i) => ((acc[n] ??= []).push(i), acc), {}))
  .forEach(n => n.length > 1 && n.forEach(i => arr[i] = newValue));

$('.payment-innovation .item').css('opacity', 0);

$('.payment-innovation .list-block__head').click(function() {
  const $this = $(this);
  const $items = $this.closest('.list-block').find('.item');
  const visible = $this.toggleClass('visible').hasClass('visible');
  const duration = 400;

  $items.each((i, n) => $(n)
    .delay((visible ? i : $items.length - i - 1) * duration)
    .animate({ opacity: +visible }, duration)
  );
}).click();

svgElem.setAttributeNS('http://www.w3.org/2000/svg', 'viewBox', '0 0 50 50')

Или пусть создание элемента выглядит так:

document.createElementNS('http://www.w3.org/2000/svg', 'svg')

Чтобы ответить на этот вопрос, достаточно подумать над тем, как будет выглядеть подключение ещё одного обработчика в каждом из представленных случаев.

Заменить объект на новый:

const index = arr.findIndex(n => n.id === newObj.id);
arr[index === -1 ? arr.length : index] = newObj;

Обновить существующий объект:

const obj = arr.find(n => n.id === newObj.id);
if (obj) {
  Object.assign(obj, newObj);
} else {
  arr.push(newObj);
}

stuff.map(n => `${n.firstName} ${n.lastName}`).sort((a, b) => a.localeCompare(b))