0xD34F

const count = str => [...str]
  .reduce((acc, n, i, a) => (
    a[i - 1] !== n && acc.push([ n, 0 ]),
    acc[acc.length - 1][1]++,
    acc
  ), [])
  .flat()
  .join('');

или

const count = str => str.replace(/(.)\1*/g, m => m[0] + m.length);

Как можно получить дату из строки:

const parseDate = str =>
  new Date(str.split(' ', 1)[0].split('.').reverse().join('-'));

// или

const parseDate = str =>
  new Date(str.replace(/(\d+)\.(\d+)\.(\d+)(.+)/, '$3-$2-$1'));

// или

const parseDate = str =>
  (str = str.match(/\d+/g), new Date(str[2], ~-str[1], str[0]));

Получаем, форматируем:

const result = parseDate(str).toLocaleString('ru-RU', {
  month: 'long',
  day: 'numeric',
});

const $checkbox = $('.form__chekbox');
const $cbAll = $checkbox.filter('.form__chekbox_all');
const $cb = $checkbox.not($cbAll);

$cbAll.change(e => $cb.prop('checked', false));

$cb.change(() => {
  const $checked = $cb.filter(':checked');
  const allChecked = $checked.length === $cb.length;
  $cbAll.prop('checked', !$checked.length || allChecked);
  $cb.prop('checked', (i, val) => allChecked ? false : val);
});

const combine = (keys, values, defaultValue = () => null) =>
  Array.from(
    { length: Math.max(...values.map(n => n.length)) },
    (_, i) => Object.fromEntries(keys.map((k, j) => [
      k,
      values[j][i] ?? defaultValue(i, j, k),
    ]))
  );

const keys = [ 'info', 'date' ];

// собираем элементы
const elements = combine(
  keys,
  keys.map(k => messagesData.querySelectorAll(`.${k}`)),
  (i, j, k) => `элемент .${k} с индексом ${i} отсутствует`
);

// или, текстовое содержимое элементов
const texts = combine(
  keys,
  keys.map(k => Array.from(
    messagesData.getElementsByClassName(k),
    n => n.textContent
  )),
);

function App(props) {
  const [ items, setItems ] = React.useState([...props.items]);
  const [ name, setName ] = React.useState('');

  const add = () => setItems([
    ...items,
    {
      id: 1 + Math.max(0, ...items.map(n => n.id)),
      name,
    },
  ]);

  return (
    <div>
      <div>
        <input onChange={e => setName(e.target.value)} />
        <button onClick={add}>add</button>
      </div>
      {items.map(n => (
        <div key={n.id}>
          {Object.entries(n).map(([ k, v ]) => <div>{k}: {v}</div>)}
        </div>
      ))}
    </div>
  );
}

mounted() {
  const observer = new IntersectionObserver(entries => {
    if (entries[0].isIntersecting) {
      stopObservation();
      // здесь запрашивайте свои данные
    }
  }, {
    threshold: 1,
  });
  observer.observe(this.$el);

  const stopObservation = () => observer.disconnect();
  this.$on('hook:beforeDestroy', stopObservation);
},

Потому что

new Date instanceof Object // true

Пора бы разобраться с основами js - какие там бывают типы данных, и в чём особенности работы с ними. В частности, как сравниваются объекты.

Потому что вы используете компонент App дважды - как корневой компонент приложения, и как компонент маршрута.

Уберите { path: '/', component: App },, или укажите вместо App какой-нибудь другой компонент.

/(?=.*1)(?=.*2)(?=.*3)/.test(str)

или

[ 1, 2, 3 ].every(n => str.includes(n))

или

new Set(str.match(/[123]/g)).size === 3

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

props: [ 'value', 'placeholder' ],

<div>
  <input
    :class="value ? 'input_filled' : ''"
    :value="value"
    @input="$emit('input', $event.target.value)"
  >
  <span>{{ placeholder }}</span>
</div>

https://jsfiddle.net/2415wkmg/

Как можно дополнить мой код, чтобы он проверял то, что требуется?

Дополнить - никак. Надо переписать. К единице надо плюсовать не все результаты рекурсивных вызовов, а только один, наибольший.

И можно как-нибудь без объявления переменной n внутри функции?

Можно:

const getMaxDepth = arr =>
  Array.isArray(arr)
    ? 1 + Math.max(0, ...arr.map(getMaxDepth))
    : 0;

console.log(getMaxDepth([ 1, [ 2 ], [ [ 3 ] ], [ [ [ 4 ] ] ] ])); // 4
console.log(getMaxDepth([])); // 1
console.log(getMaxDepth(666)); // 0

распарсить

json_encode

Вы там как, в своём уме?

А ещё скобки. Квадратные. Очень нужны. А их нет. Надо добавить. Открывающую - в начало строки. Закрывающую - ну, попробуйте угадать с трёх раз куда.

Допускается ли повторение элементов?

Если да, то просто достаём случайные элементы из исходного массива:

const createArr = (source, maxLength = source.length) =>
  Array.from(
    { length: -~(Math.random() * maxLength) },
    () => source[Math.random() * source.length | 0]
  );

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

const createArr = ([...source], maxLength = source.length) =>
  Array.from(
    { length: Math.min(source.length, -~(Math.random() * maxLength)) },
    () => source.splice(Math.random() * source.length | 0, 1)[0]
  );

Или, перемешиваем копию исходного массива и берём сколько надо элементов из начала:

function createArr([...source], maxLength = source.length) {
  for (let i = source.length; --i > 0;) {
    const j = Math.random() * -~i | 0;
    [ source[j], source[i] ] = [ source[i], source[j] ];
  }

  return source.slice(0, -~(Math.random() * maxLength));
}

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

Циклы есть:

function createTable(
  rows,
  cols,
  {
    rowSeparator = '\n',
    colSeparator = ' ',
  } = {},
) {
  const zeros = '0'.repeat(Math.ceil(Math.log10(rows * cols + 1)));
  const result = [];

  for (let i = 0; i < rows; i++) {
    result.push(i ? rowSeparator : '');

    for (let j = 0; j < cols; j++) {
      result.push(
        j ? colSeparator : '',
        (zeros + (cols * i + j + 1)).slice(-zeros.length)
      );
    }
  }

  return ''.concat(...result);
}

Циклов нет:

function createTable(
  rows,
  cols,
  {
    rowSeparator = '\n',
    colSeparator = ' ',
  } = {},
) {
  const { length } = `${rows * cols}`;

  return Array.from({ length: rows }, (_, i) =>
    Array.from({ length: cols }, (_, j) =>
      `${cols * i + j + 1}`.padStart(length, 0)
    ).join(colSeparator)
  ).join(rowSeparator);
}

Примеры использования:

console.log(createTable(11, 9));
console.log(createTable(10, 10));

document.body.innerHTML = createTable(16, 16, {
  rowSeparator: '<br>',
  colSeparator: '____',
});

https://datatables.net/reference/option/language.search

series: {
  0: {
    color: 'red',
  },
},

const grouped = arr.reduce((acc, n) => {
  const [ , month, year ] = n.x.split('.');
  (acc[year] ??= Array(12).fill(0))[month - 1] += n.y;
  return acc;
}, {});

/^[^/|%[\]]*$/.test(str)

или, соответственно, если зайти с другой стороны:

!/[/|%[\]]/.test(str)