JavaScript · данные

Операторы spread и rest

Три точки ... имеют два близких применения. Spread раскрывает коллекцию на отдельные значения, а rest собирает оставшиеся значения в одну переменную.

Копирование и объединение массивов

Spread создаёт новый поверхностный массив. Вложенные объекты при этом остаются общими ссылками.

const first = [1, 2];
const second = [3, 4];
const all = [...first, ...second];
const copy = [...all];

Новый объект

Поля более позднего объекта перекрывают предыдущие. Такой приём удобен для неизменяемого обновления состояния.

const user = { name: 'Лена', theme: 'light' };
const updated = { ...user, theme: 'dark' };

Rest-параметры

В объявлении функции три точки собирают оставшиеся аргументы в обычный массив. Rest должен быть последним параметром.

function sum(...numbers) {
  return numbers.reduce((total, number) => total + number, 0);
}
sum(2, 4, 6);

Частые ошибки

• Считать spread глубоким копированием.
• Ставить rest не последним параметром.
• Перепутать порядок объединения объектов.
• Разворачивать огромный массив в аргументы функции.

Связанные темы

Деструктуризация · reduce()