0xD34F

Как будем определять, должен ли элемент остаться: const mustStay = n => n !== null;.

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

const newArr = arr.map(n => ({
  ...n,
  array2: n.array2.filter(mustStay),
}));

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

for (let i = 0; i < arr.length; i++) {
  const a = arr[i].array2;
  for (let j = 0; j < a.length; j++) {
    if (!mustStay(a[j])) {
      for (let k = j--; ++k < a.length; a[k - 1] = a[k]) ;
      a.pop();
    }
  }
}

// или

arr.forEach(n => {
  n.array2.reduceRight((_, n, i, a) => mustStay(n) || a.splice(i, 1), 0);
});

// или

(function next(i, { array2: a } = arr[i] ?? {}) {
  if (a) {
    a.splice(0, a.length, ...a.filter(mustStay));
    next(-~i);
  }
})(0);

// или

for (const { array2: a } of arr) {
  a.length -= a.reduce((acc, n, i) => (
    a[i - acc] = n,
    acc + !mustStay(n)
  ), 0);
}

Укажите нормальные атрибуты name для чекбоксов - соответствующие столбцам, по которым будет осуществляться фильтрация с использованием их значений. Т.е., color для первой группы, fruit для второй.

const table = document.querySelector('table');

const columnIndex = Object.fromEntries(Array.from(
  table.tHead.rows[0].cells,
  n => [ n.innerText.toLowerCase(), n.cellIndex ]
));

function onChange() {
  const filters = Object.entries(Array.prototype.reduce.call(
    document.querySelectorAll('.list-group :checked'),
    (acc, n) => ((acc[columnIndex[n.name]] ??= []).push(n.value), acc),
    {}
  ));

  for (const { rows } of table.tBodies) {
    for (const tr of rows) {
      tr.hidden = filters.some(n => !n[1].includes(tr.cells[n[0]].innerText));
    }
  }
}

document.querySelectorAll('.list-group').forEach(n => {
  n.addEventListener('change', onChange);
});

кнопки на самой папке не нужны

У слотов treeview есть параметр, указывающий, является ли текущий элемент дерева листом (т.е., не содержит дочерних элементов). Используйте его значение для условного рендеринга контента слота:

<template #append="{ leaf }">
  <template v-if="leaf">
    <v-btn small><v-icon>mdi-plus-box</v-icon></v-btn>
    <v-btn small><v-icon>mdi-file-edit-outline</v-icon></v-btn>
    <v-btn small><v-icon>mdi-content-save-settings</v-icon></v-btn>
    <v-btn small><v-icon>mdi-minus-circle-outline</v-icon></v-btn>
  </template>
</template>

https://jsfiddle.net/ac89dz1b/

{ i + 1: lst[i] for i in range(len(lst)) }

Рекурсия есть:

const getElementsWithDepth = (el, depth = 0) =>
  [...el.children].reduce((acc, n) => (
    acc.push(...getElementsWithDepth(n, depth + 1)),
    acc
  ), [ { el, depth } ]);

Рекурсии нет:

function getElementsWithDepth(root) {
  const result = [];

  for (const stack = [ [ root, 0 ] ]; stack.length;) {
    const [ el, depth ] = stack.pop();
    result.push({ el, depth });
    stack.push(...Array.from(el.children, n => [ n, -~depth ]).reverse());
  }

  return result;
}

// или

const getElementsWithDepth = root =>
  Array.prototype.reduce.call(
    root.querySelectorAll('*'),
    (acc, n) => {
      acc.push({ el: n, depth: 1 });
      for (; (n = n.parentNode) !== root; acc[acc.length - 1].depth++) ;
      return acc;
    },
    [ { el: root, depth: 0 } ]
  );

SELECT * FROM 'users'

Не знал, что можно указывать имя таблицы в одинарных кавычках. Или всё-таки нельзя?

function getDays(year, month) {
  const days = [];
  const d = new Date(year, month, 1);
  let week = 1;

  while (d.getMonth() === month) {
    const date = d.getDate();
    const day = d.getDay();

    days.push({
      day: date,
      weeknumber: (day === 1 || date === 1) ? week : false,
      weekday: d.toLocaleString('en-US', { weekday: 'short' }),
    });

    d.setDate(date + 1);
    week += !day;
  }

  return days;
}

const count = text.match(RegExp(str, 'g'))?.length ?? 0;

// или

const count = text.split(str).length - 1;

// или

const count = (function get(pos) {
  const i = text.indexOf(str, pos);
  return +(i !== -1) && -~get(i + str.length);
})(0);

<TreePicker
  locale={{
    searchPlaceholder: 'hello, world!!',
  }}

Правда, есть проблема - значение не объединяется с дефолтным, а заменяет его, так что придётся дополнительно указывать остальные свойства, если не хотите видеть пустоту на месте основного плейсхолдера и сообщения об отсутствии результатов поиска.

Правильно понимаю, что массивы обрабатывать не надо? Т.е.,

const isObject = v =>
  v instanceof Object && !Array.isArray(v);

Рекурсия есть:

const flatObj = obj => Object
  .entries(isObject(obj) ? obj : {})
  .reduce((acc, [ k, v ]) => (
    isObject(v)
      ? Object.assign(acc, flatObj(v))
      : acc[k] = v,
    acc
  ), {});

Рекурсии нет:

function flatObj(obj) {
  const result = {};

  for (const stack = isObject(obj) ? [ [ , obj ] ] : []; stack.length;) {
    const [ k, v ] = stack.pop();
    if (isObject(v)) {
      stack.push(...Object.entries(v).reverse());
    } else {
      result[k] = v;
    }
  }

  return result;
}

Такие варианты есть:

document.querySelectorAll('h2').forEach(n => {
  const [ season, , episode ] = n.innerText.split(' ');
  if (+episode === 1) {
    n.id = `season-${season}`;
  }
});

[...document.querySelectorAll('h2')]
  .filter(n => n.innerText.endsWith(', 1 серия'))
  .forEach((n, i) => n.id = `season-${i + 1}`);

document.querySelectorAll('h2').forEach((n, i, a) => {
  const prev = i && a[i - 1].innerText.match(/\d+/)[0];
  const curr = n.innerText.match(/\d+/)[0];
  if (curr !== prev) {
    n.id = `season-${curr}`;
  }
});

Array
  .from(document.querySelectorAll('h2'))
  .reduce((acc, n) => (acc[parseInt(n.innerText)] ??= n, acc), [])
  .forEach((n, i) => n.id = `season-${i}`);

<div class="slider">

$('.slick').slick({

Так как правильно - slider или slick? Вы бы определились.

data-category="orange"

var filterClass = $(this).data('category');

$('.slick').slick('slickFilter', filterClass);

Где-то тут точки не хватает - имена классов, они точкой в начале обозначаются.

А ещё сброс фильтра (пункт "all color") работать не будет - это надо отдельно обрабатывать:

$('.category__menu').on('click', 'li', function() {
  $('.slider').slick('slickUnfilter');

  const category = $(this).data('category');
  if (category !== 'allPost') {
    $('.slider').slick('slickFilter', `.${category}`);
  }
});

Коротко:

const transpose = matrix => Array.from(
  { length: matrix[0]?.length ?? 0 },
  (_, i) => matrix.map(n => n[i])
);

Длинно:

function transpose(matrix) {
  const result = Array(matrix.length && matrix[0].length);

  for (let i = 0; i < result.length; i++) {
    result[i] = [];

    for (let j = 0; j < matrix.length; j++) {
      result[i][j] = matrix[j][i];
    }
  }

  return result;
}

Делаем просто:

const result = arr.reduce((acc, n, i, a) => (
  n === a[i - 1] + 1 || acc.push([]),
  acc[acc.length - 1].push(n),
  acc
), []);

Делаем сложно:

function groupAdjacent(
  data,
  {
    key = n => n,
    newGroup = (c, p) => c !== p,
  } = {}
) {
  const getVal = key instanceof Function ? key : n => n[key];

  return Array.prototype.reduce.call(
    data,
    (acc, n, i) => {
      const v = getVal(n, i);
      const iGroup = acc[0].length - (i && !newGroup(v, acc[1]));
      (acc[0][iGroup] ??= []).push(n);
      acc[1] = v;
      return acc;
    },
    [ [], null ]
  )[0];
}

const result = groupAdjacent(arr, { newGroup: (c, p) => c !== -~p });
// или
const result = groupAdjacent(arr, { key: (n, i) => n - i });

const [ form, setForm ] = useState({
  login: '',
  password: '',
});

const onChange = ({ target: t }) => setForm({ ...form, [t.name]: t.value });

<input name="login" value={form.login} onChange={onChange} />
<input name="password" value={form.password} onChange={onChange} />

$('.js-cropped-word').text((i, text) => text.replace(/(?<=\S{19,}).+/, '...'));

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

В Сафари не работает

Это из-за lookbehind. Делайте тогда так:

document.querySelectorAll('.js-cropped-word').forEach(n => {
  n.textContent = n.textContent.replace(/(\S{19}).+/, '$1...');
});

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

const max = 19;

for (const n of document.getElementsByClassName('js-cropped-word')) {
  const words = n.innerText.split(' ');
  const i = words.findIndex(n => n.length > max);
  if (i !== -1) {
    words.length = i + 1;
    words[i] = words[i].slice(0, max) + '...';
    n.innerText = words.join(' ');
  }
}

const [ width, setWidth ] = useState(0);
const onChange = e => setWidth(e.target.value);
const styles = { width: `${width}px` };

<input value={width} onChange={onChange} />
<div style={styles}>

Кого и во что надо обернуть:

const elements = document.querySelectorAll('input[type="button"]');
const tag = 'div';
const className = 'block';

Оборачиваем:

elements.forEach(n => {
  n.after(document.createElement(tag));
  n.nextSibling.className = className;
  n.nextSibling.append(n);
});

или

for (const n of elements) {
  const wrapper = document.createElement(tag);
  wrapper.classList.add(className);
  wrapper.appendChild(n.parentNode.replaceChild(wrapper, n));
}

или

for (let i = 0; i < elements.length; i++) {
  const wrapper = document.createElement(tag);
  elements[i].replaceWith(wrapper);
  wrapper.classList.value = className;
  wrapper.insertAdjacentElement('afterbegin', elements[i]);
}

или

(function wrap(i, n = elements.item(i)) {
  if (n) {
    n.outerHTML = `<${tag} class="${className}">${n.outerHTML}</${tag}>`;
    wrap(-~i);
  }
})(0);