← Назад ко всем вопросам

Какой есть нюанс при копировании объекта через Object.assign

1️⃣ Как кратко ответить

Object.assign выполняет поверхностное копирование объекта, что означает, что вложенные объекты копируются по ссылке, а не по значению. Это может привести к непреднамеренному изменению данных в оригинальном объекте при изменении вложенных объектов в копии.

2️⃣ Подробное объяснение темы

Object.assign — это метод в JavaScript, который используется для копирования значений всех собственных перечисляемых свойств из одного или более исходных объектов в целевой объект. Он возвращает целевой объект. Однако важно понимать, что Object.assign выполняет поверхностное копирование, а не глубокое.

Поверхностное копирование означает, что если объект содержит вложенные объекты (например, объекты внутри объектов или массивы), то копируются только ссылки на эти вложенные объекты, а не их значения. Это может привести к тому, что изменения в вложенных объектах в копии будут отражаться и в оригинальном объекте.

Пример:

const original = {
  name: 'John',
  address: {
    city: 'New York',
    zip: '10001'
  }
};
​
const copy = Object.assign({}, original);
​
// Изменяем вложенный объект в копии
copy.address.city = 'Los Angeles';
​
// Проверяем оригинальный объект
console.log(original.address.city); // 'Los Angeles'

Объяснение кода:

  • const original = {...}: Создаем объект original с двумя свойствами: name и address. address — это вложенный объект.
  • const copy = Object.assign({}, original);: Создаем новый объект copy и копируем в него свойства из original с помощью Object.assign. Это поверхностное копирование, поэтому address в copy и original ссылается на один и тот же объект.
  • copy.address.city = 'Los Angeles';: Изменяем свойство city во вложенном объекте address в копии. Поскольку address — это ссылка, изменение отражается и в original.
  • console.log(original.address.city);: Выводим значение city из original. Оно изменилось на 'Los Angeles', что демонстрирует эффект поверхностного копирования.

Когда это важно:

Понимание поверхностного копирования важно при работе с объектами, чтобы избежать непреднамеренных изменений данных. Если требуется независимая копия объекта, включая все вложенные объекты, необходимо использовать методы глубокого копирования, такие как рекурсивные функции или библиотеки вроде Lodash с функцией _.cloneDeep.

Тема: JavaScript
Стадия: Tech

🔒 Подпишись на бусти автора и стань Алигатором, чтобы получить полный доступ к функционалу сайта и отслеживать свой прогресс!

Твои заметки