0xD34F

Куда и что надо переместить:

const where = '.list';
const what = '.content';

Перемещаем:

const $targets = $(where).children();
$(what).each((i, n) => $targets.eq(i).append(n));

или

const targets = document.querySelector(where).children;
document.querySelectorAll(what).forEach((n, i) => targets[i]?.append(n));

Если нужен конкретный объект:

Object.values(data).flat().find(n => n.title === search)

Если надо сохранить исходную структуру, выкинув то, что не подходит (здесь вместо точного соответствия частичное без учёта регистра - так, для разнообразия):

Object.fromEntries(Object
  .entries(data)
  .map(n => [ n[0], n[1].filter(m => m.title.toLowerCase().includes(search.toLowerCase())) ])
  .filter(n => n[1].length)
)

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

const result = Object.values(cars.reduce((acc, n) => (
  (acc[n.make] ??= { make: n.make, attr: [] }).attr.push(n),
  acc
), {}));

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

function group(data, key, val = n => n) {
  const getKey = key instanceof Function ? key : n => n[key];
  const getVal = val instanceof Function ? val : n => n[val];
  const result = new Map;

  for (const n of data) {
    const k = getKey(n);
    result.set(k, result.get(k) ?? []).get(k).push(getVal(n));
  }

  return result;
}

const result = Array.from(
  group(cars, 'make'),
  ([ make, attr ]) => ({ make, attr })
);

phoneDisabled.addEventListener('input', function() {
  buttonDisabled.disabled = phoneMask.unmaskedValue.length !== 11;
});

str.slice(1, -1).split(', ')

// или

JSON.parse(str.replace(/[а-яё]+/g, '"$&"'))

// или

str.match(/[^\s\[\],]+/g) ?? []

coord.split(', ').map(Number)

// или

coord.match(/[\d.]+/g).map(n => +n)

// или

eval(`[${coord}]`)

// или

JSON.parse('['.concat(coord, ']'))

// или

Array.from(coord.matchAll(/[^, ]+/g), parseFloat)

for (const n of str.matchAll(/---([A-Z]+)---(.*?)(?=---|$)/g)) {
  console.log(n[1], n[2].trim());
}

По какой причине JS результатом к выражению 1.4 + 0.2 возвращает 1.5999999999999999?
Js как то странно считает числа, почему?
Откуда значения?
Почему в JS 0.1+0.2 не равно 0.3?
Почему JS складывает с разной точностью?
При складывании в js от куда-то берется 0.00000000000000001?
Откуда берутся сотые доли при умножении на дробное число?
Почему js так считает числа в данном примере?
Почему JS добавляет левые цифры?
Почему var a:Double =0.0, a += 0.1 дает не точный результат?

const result = [...subcategory.reduce(
  (acc, n) => (acc.get(n.category)?.children.push(n), acc),
  new Map(category.map(n => [ n.id, { ...n, children: [] } ]))
).values()];

или

const result = category.map(n => ({
  ...n,
  children: subcategory.filter(m => m.category === n.id),
}));

или

const result = category.map(function(n) {
  return {
    ...n,
    children: this[n.id] ?? [],
  };
}, subcategory.reduce((acc, n) => ((acc[n.category] ??= []).push(n), acc), {}));

$('.item').on('mouseover', '.dot', function({ delegateTarget: t }) {
  $('.thumb-target', t).attr('src', $(this).data('img'));
  $('.dot', t).removeClass('select').filter(this).addClass('select');
});

или

document.querySelectorAll('.item').forEach(n => {
  n.addEventListener('mouseover', onMouseOver);
});

function onMouseOver({ target: t, currentTarget: ct }) {
  const dot = t.closest('.dot');
  if (dot) {
    ct.querySelector('.thumb-target').src = dot.dataset.img;
    ct.querySelectorAll('.dot').forEach(n => {
      n.classList.toggle('select', n === dot);
    });
  }
}

Коротко:

const sum = (...arr) => arr
  .flatMap(Object.entries)
  .reduce((acc, [ k, v ]) => (
    acc[k] = (acc[k] ?? 0) + v,
    acc
  ), {});

Длинно:

function sum() {
  const result = {};

  for (const n of arguments) {
    for (const k in n) {
      if (n.hasOwnProperty(k)) {
        if (!result.hasOwnProperty(k)) {
          result[k] = 0;
        }

        result[k] += n[k];
      }
    }
  }

  return result;
}

Использовать, понятное дело, так: const obj = sum(obj1, obj2);.

Во-первых, события не добавляют - так говорить безграмотно. Добавляют обработчики событий.

Во-вторых:

Если зарегистрировано несколько одинаковых EventListener на одном EventTarget с одинаковыми параметрами, дублирующиеся обработчики игнорируются.

На каких элементах хотим ловить клики, где эти элементы находятся, какой data-атрибут хотим достать:

const container = document.querySelector('#element');
const itemSelector = '.someclass';
const key = 'id';
const attr = `data-${key}`;
const attrSelector = `[${attr}]`;

Слушаем клики непосредственно на элементах:

container.querySelectorAll(itemSelector).forEach(function(n) {
  n.addEventListener('click', this);
}, function(e) {
  e.preventDefault();
  let el = this;
  while (!(el = el.parentNode).hasAttribute(attr)) ;
  console.log(el.getAttribute(attr));
});

Или, на обладателях data-атрибута:

container.querySelectorAll(attrSelector).forEach(n => {
  n.addEventListener('click', onClick);
});

function onClick(e) {
  if (e.target.matches(itemSelector)) {
    e.preventDefault();
    console.log(e.currentTarget.attributes[attr].value);
  }
}

Или, на контейнере:

container.addEventListener('click', e => {
  const item = e.target.closest(itemSelector);
  if (item) {
    e.preventDefault();
    console.log(item.closest(attrSelector).dataset[key]);
  }
});

function sort(arr) {
  const obj = Object.fromEntries(arr.map(n => [ n.parent, n ]));
  const sorted = [];

  for (let item = obj['null']; item; item = obj[item.id]) {
    sorted.push(item);
  }

  return sorted;
}

или

function sort(arr, parent = null) {
  const item = arr.find(n => n.parent === parent);
  return item
    ? [ item, ...sort(arr, item.id) ]
    : [];
}

const formatDateStr = str =>
  new Date(str.split(' GMT', 1)[0])
    .toLocaleDateString('ru-RU')
    .split('.')
    .reverse()
    .join(', ');

или

const formatDateStr = function(str) {
  const [ , month, day, year ] = str.match(/(\S+) (\d+) (\d+)/);
  return [ year, this[month], day.padStart(2, 0) ].join(', ');
}.bind(Object.fromEntries(Array.from({ length: 12 }, (_, i) => [
  new Date(0, i).toLocaleString('en', { month: 'short' }),
  `${i + 1}`.padStart(2, 0)
])));

Коротко:

const includes = (arrs, search) =>
  arrs.some(arr => arr.length === search.length && arr.every((n, i) => n === search[i]));

Длинно:

function includes(arrs, search) {
COMPARE_ARRAYS:
  for (const arr of arrs) {
    if (arr.length === search.length) {
      for (const [ i, n ] of arr.entries()) {
        if (!Object.is(n, search[i])) {
          continue COMPARE_ARRAYS;
        }
      }

      return true;
    }
  }

  return false;
}

Собираем массив столбцов:

const columns = [ '#', ...new Set(persons.flatMap(Object.keys)) ];

// или

const columns = [ '#' ].concat(Object.keys(Object.assign({}, ...persons)));

Собираем разметку таблицы:

document.body.insertAdjacentHTML('beforeend', `
  <table>
    <thead>
      <tr>${columns.map(col => `
        <th>${col}</th>`).join('')}
      </tr>
    </thead>
    <tbody>${persons.map((person, i) => `
      <tr>${columns.map((col, j) => `
        <td>${j ? person[col] ?? '-' : i}</td>`).join('')}
      </tr>`).join('')}
    </tbody>
  </table>
`);

Или, создаём элементы напрямую:

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

table.createTHead().insertRow().append(...columns.reduce((acc, col) => (
  (acc[acc.length] = document.createElement('th')).textContent = col,
  acc
), []));

persons.forEach(function(person, i) {
  columns.forEach(function(col, j) {
    this.insertCell().textContent = j ? person[col] ?? '-' : i;
  }, this.insertRow());
}, table.createTBody());

document.body.append(table);

async function Func() {
  console.log('START');

  await new Promise(r => {
    $('div').one('click', () => (console.log('CLICK'), r()));
  });

  console.log('END');
}

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

const find = (data, test, key) =>
  test(key, data)
    ? data
    : data === Object(data)
      ? Object.entries(data).reduce((found, n) =>
          found !== null ? found : find(n[1], test, n[0])
        , null)
      : null;

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

function find(data, test) {
  for (const stack = [ [ , data ] ]; stack.length;) {
    const [ k, v ] = stack.pop();
    if (test(k, v)) {
      return v;
    } else if (v instanceof Object) {
      stack.push(...Object.entries(v).reverse());
    }
  }

  return null;
}

Ищем:

const value = find(вложенный_объект, k => k === 'ключ');

Брехня, всё срабатывает.

Бегом гуглить, что такое всплытие событий.

Надо его останавливать:

const $section = $('.section').on('click', () => $section.addClass('opened'));
$section.find('.close').on('click', e => {
  e.stopPropagation();
  $section.removeClass('opened');
});

// или

const section = document.querySelector('.section');
section.addEventListener('click', () => section.classList.add('opened'));
section.querySelector('.close').addEventListener('click', e => (
  e.stopPropagation(),
  section.classList.remove('opened')
));

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

const $section = $('section').click(e => {
  $section.toggleClass('opened', !$(e.target).is('.close'));
});

// или

document.querySelector('.section').addEventListener('click', e => {
  e.currentTarget.classList.toggle('opened', !e.target.matches('.close'));
});