0xD34F

Как будем определять, надо ли отправить элемент в конец массива:

const checkItem = item => item.status === 'выполнено';

Изменяем существующий массив:

arr.sort((a, b) => +checkItem(a) || -checkItem(b));

// или

arr.reduceRight((_, n, i, a) => checkItem(n) && a.push(a.splice(i, 1)[0]), null);

// или

arr
  .reduce((acc, n, i) => (
    arr[i - acc.length] = n,
    checkItem(n) && acc.push(n),
    acc
  ), [])
  .forEach((n, i, a) => arr[arr.length - a.length + i] = n);

Создаём новый:

const newArr = arr
  .reduce((acc, n) => (
    acc[+checkItem(n)].push(n),
    acc
  ), [ [], [] ])
  .flat();

// или

const newArr = arr.reduce((acc, n) => (
  acc[checkItem(n) ? 'push' : 'unshift'](n),
  acc
), []);

// или

const newArr = [
  ...arr.filter(n => !checkItem(n)),
  ...arr.filter(checkItem),
];

.card.show .text {
  display: block;
}

const containerSelector = '.card';
const buttonSelector = 'button';
const activeClass = 'show';

document.addEventListener('click', e => {
  const button = e.target.closest(buttonSelector);
  const container = button && button.closest(containerSelector);
  container && container.classList.toggle(activeClass);
});

// или

document
  .querySelectorAll(`${containerSelector} ${buttonSelector}`)
  .forEach(n => n.addEventListener('click', onClick));

function onClick() {
  this.closest(containerSelector).classList.toggle(activeClass);
}

Идентификаторы объектов, которые хотим получить, сложим в массив:

const ids = [ 9, 10 ];

Вложенные массивы объектов соберём в один общий:

const items = arr.flatMap(n => n.items);

// или

const items = Array.prototype.concat.apply([], arr.map(n => n.items));

// или

const items = arr.reduce((acc, n) => (acc.push(...n.items), acc), []);

Извлечём объекты:

const result = items.filter(n => ids.includes(n.id));

// или

const result = items.filter(function(n) {
  return this.has(n.id);
}, new Set(ids));

// или

const itemsObj = Object.fromEntries(items.map(n => [ n.id, n ]));
const result = ids.reduce((acc, n) => ((n = itemsObj[n]) && acc.push(n), acc), []);

Массив подсовываете в качестве значения.

<button data-step="+1">PREV</button>
<button data-step="-1">NEXT</button>

const sliderSelector = '.slider';
const blockSelector = '.block';
const buttonDataAttr = 'step';
const buttonSelector = `[data-${buttonDataAttr}]`;
const activeClass = 'active';
const getActiveBlockIndex = () => ((-pos % len) + len) % len;
const getSliderRotation = () => 'rotate(' + pos * 360 / len + 'deg)';
let pos = 0;

Вот jquery:

const $slider = $(sliderSelector);
const $blocks = $slider.find(blockSelector);
const len = $blocks.length;

$(buttonSelector).click(function() {
  $blocks.eq(getActiveBlockIndex()).removeClass(activeClass);
  pos += parseInt($(this).data(buttonDataAttr));
  $slider.css('transform', getSliderRotation());
  $blocks.eq(getActiveBlockIndex()).addClass(activeClass);
});

А вот jquery нет:

const slider = document.querySelector(sliderSelector);
const blocks = slider.querySelectorAll(blockSelector);
const len = blocks.length;

document.querySelectorAll(buttonSelector).forEach(function(n) {
  n.addEventListener('click', this);
}, function() {
  blocks[getActiveBlockIndex()].classList.remove(activeClass);
  pos += +this.dataset[buttonDataAttr];
  slider.style.transform = getSliderRotation();
  blocks[getActiveBlockIndex()].classList.add(activeClass);
});

Метод search использует для поиска регулярные выражения, и если аргумент таковым не является, он будет в регулярку преобразован. Круглые скобки в регулярных выражениях являются спецсимволами, так что если хотите, чтобы скобка была просто скобкой, её надо экранировать. Поставьте перед ней два обратных слэша: .search('\\('). Или один, если замените строку на литерал регулярного выражения: .search(/\(/).

Кого надо подвинуть: const selector = '.test_wr .test_block';.

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

const key = 'top'; // или 'margin-top'
const getVal = i => (i * 100) + 'px';

// или

const key = 'transform';
const getVal = i => `translateY(${i * 100}px)`;

Вот так всё просто получается:

$(selector).css(key, getVal);

// или

document.querySelectorAll(selector).forEach((n, i) => {
  n.style[key] = getVal(i);
  // или
  n.style.setProperty(key, getVal(i));
  // или
  n.style.cssText += [ key, ': ', getVal(i) ].join('');
  // или
  n.setAttribute('style', key.concat(': ', getVal(i)));
});

array_map(function($id, $result) {
  return compact('id', 'result');
}, explode(',', $ids), explode('|', $results))

setUser({ ...user, [name]: value })

@mouseenter="onGetData(component_index, index, $event)"

methods: {
  onGetData(component_index, index, e) {
    const { bottom } = e.target.getBoundingClientRect();

Cannot read property 'concat' of null

В чем ошибка и как в итоге их объединить?

Так написано же в чём - не удаётся прочитать свойство concat у null. Вы пытаетесь выполнять какие-то действия над свойствами компонента, как над массивами, но данные ещё не загрузились, и они (свойства) всё ещё null.

Выполняйте объединение массивов только в том случае, если оба свойства не null:

computed: {
  fullArray() {
    const { users, info } = this;

    return user && info
      ? здесь объединяете данные массивов
      : [];
  },
},

Или установите в качестве начальных значений пустые массивы вместо null.

json.results.map(({ lists, volume }) => {
  return lists.map(({ tags, list }) => {
    return tags.map(tag => ({ volume, list, tag }));
  });
}).flat(2)

https://jsfiddle.net/95fjzq2g/

Фильтр или метод сделайте:

data: () => ({
  date: new Date(),
}),
filters: {
  formatDate1: d => d.toLocaleString('ru-RU').replace(',', '').slice(0, -3),
},
methods: {
  formatDate2: d => [ 'Date', 'Month', 'FullYear', 'Hours', 'Minutes' ]
    .map((n, i) => '.. :'.charAt(~-i) + `${d[`get${n}`]() + !~-i}`.padStart(2, 0))
    .join(''),
},

<div class="fullDate">{{ date | formatDate1 }}</div>
<div class="fullDate">{{ formatDate2(date) }}</div>

Особенности парсинга DOM-шаблона:

Некоторые HTML-элементы, такие как <ul>, <ol>, <table> и <select> имеют ограничения на то, какие элементы могут отображаться внутри них, или например элементы, такие как <li>, <tr> и <option> могут появляться только внутри других определённых элементов.

Это приведёт к проблемам при использовании компонентов с элементами, которые имеют такие ограничения. Например:

<table>
  <blog-post-row></blog-post-row>
</table>

Пользовательский компонент <blog-post-row> будет поднят выше, так как считается недопустимым содержимым, вызывая ошибки в итоговой отрисовке. К счастью, специальный атрибут is предоставляет решение этой проблемы:

<table>
  <tr is="blog-post-row"></tr>
</table>

Сначала превращаем плоский массив во вложенный:

function createTreeData(data, {
  key = 'id',
  parentKey = 'parentId',
  childrenKey = 'children',
} = {}) {
  const tree = Object.fromEntries(data.map(n => [
    n[key],
    { ...n, [childrenKey]: [] },
  ]));

  return Object.values(tree).filter(n => !(
    tree[n[parentKey]] && tree[n[parentKey]][childrenKey].push(n)
  ));
}

Затем из вложенного массива можно собрать разметку:

const createTreeHTML = data =>
  Array.isArray(data) && data.length
    ? `<ul>${data.map(n => `
         <li>
           ${n.name}
           ${createTreeHTML(n.children)}
         </li>`).join('')}
       </ul>`
    : '';

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

const createTreeElement = data =>
  data instanceof Array && data.length
    ? data.reduce((ul, n) => (
        ul.append(document.createElement('li')),
        ul.lastChild.append(n.name, createTreeElement(n.children)),
        ul
      ), document.createElement('ul'))
    : '';

Вот так всё просто получается:

const treeData = createTreeData(obj, { parentKey: 'parent_id' });

document.body.insertAdjacentHTML('beforeend', createTreeHTML(treeData));
document.body.append(createTreeElement(treeData));

Но вообще, можно ещё проще - без собирания вложенного массива:

function createTreeElements(data, key, parentKey) {
  const tree = data.reduce((acc, { [parentKey]: n }) => (
    acc[n] = acc[n] || document.createElement('ul'),
    acc
  ), {});

  data.forEach(n => (
    tree[n[parentKey]].append(document.createElement('li')),
    tree[n[parentKey]].lastChild.append(n.name, tree[n[key]] || '')
  ));

  return Object.values(tree).filter(n => !n.parentNode);
}

document.body.append(...createTreeElements(obj, 'id', 'parent_id'));

const result = Object
  .entries(arr.reduce((acc, [ n ], i) => ((acc[n] = acc[n] || []).push(i), acc), {}))
  .map(n => ({ [n[0]]: n[1] }));

унификация

function filterByMinMax(arr, [ min, max ], key = n => n) {
  const getVal = key instanceof Function ? key : n => n[key];
  return arr.filter(n => {
    const val = getVal(n);
    return (min == null || min <= val) && (max == null || val <= max);
  });
}

const d1 = filterByMinMax(chartPoints, [ new Date('2019-02-19') ], n => new Date(n.date));
const d2 = filterByMinMax(chartPoints, [ , '2019-01-23' ], n => n.date);
const d3 = filterByMinMax(chartPoints, [ '2019-02-12', '2019-02-26' ], 'date');