Как работает spread при копировании массивов и объектов?

Оператор spread (три точки ...) в JavaScript позволяет разворачивать итерируемые значения (массивы, строки) или перечисляемые свойства объектов в новую структуру. При копировании он создаёт новый массив или объект, но копирует только верхний уровень — это называется поверхностным (shallow) копированием.

Копирование массивов

Для массива spread создаёт новый массив с теми же элементами. Примитивы копируются по значению, а объекты внутри — по ссылке.

const arr = [1, 2, { a: 3 }];
const copy = [...arr];
copy[0] = 99;        // arr[0] остаётся 1
copy[2].a = 42;      // arr[2].a тоже станет 42
console.log(arr);    // [1, 2, { a: 42 }]

Копирование объектов

Для объектов spread копирует собственные перечисляемые свойства. Вложенные объекты остаются общими ссылками.

const user = { name: 'Ann', address: { city: 'NY' } };
const clone = { ...user };
clone.name = 'Bob';          // user.name не меняется
clone.address.city = 'LA';   // user.address.city тоже 'LA'

Где применяется

• Иммутабельные обновления состояния в React и Redux.
• Объединение массивов и объектов: [...a, ...b], {...a, ...b}.
• Передача аргументов: Math.max(...nums).

Глубокая копия

Если нужна независимая копия вложенных структур, используют structuredClone(obj) или рекурсивное клонирование. JSON-трюк JSON.parse(JSON.stringify(obj)) теряет функции, Date, undefined и циклические ссылки.

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