Оператор spread: копирование и объединение
Как создавать новые массивы и объекты и помнить о поверхностном копировании.
Основная идея
Запись … разворачивает элементы или свойства в подходящем контексте. Она удобна для добавления пункта к новому массиву и обновления части объекта без переназначения всех полей вручную.
При объединении объектов более позднее свойство заменяет раннее с тем же именем. Копирование остаётся поверхностным: вложенный объект будет общим, пока вы не создадите отдельную копию и для него. Не путайте создание новой оболочки с независимым клонированием всего дерева.
Пример JavaScript
const original = { title: "HTML", settings: { theme: "light" } };
const updated = { ...original, title: "CSS" };
const list = ["HTML", "CSS"];
const extended = [...list, "JavaScript"];
console.log(updated.title, original.title, extended.length);
Название новой оболочки изменилось, исходное простое поле сохранилось, а новый массив содержит три элемента.
Частая ошибка
Самостоятельная проверка
Измените вложенную настройку и объясните результат. Затем создайте отдельную копию settings и повторите проверку.
Код здесь показан для изучения. Встроенная песочница сайта выполняет только HTML/CSS. JavaScript проверяйте в собственном учебном файле или консоли своего тестового проекта; не вставляйте непонятный код на страницах с личными данными.