В чем разница между глубоким и неглубоким копированием?

Разница между глубоким и неглубоким копированием

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

Глубокое копирование (Deep Copy) — полное копирование объекта и всех его вложенных объектов. Изменения в копии не влияют на оригинал, и наоборот.

Неглубокое копирование

При неглубоком копировании копируются только ссылки на вложенные объекты, а не сами объекты:

const original = { name: "John", address: { city: "Moscow" } };
const shallow = { ...original }; // или Object.assign({}, original)

shallow.name = "Jane"; // original.name остается "John"
shallow.address.city = "SPB"; // original.address.city меняется на "SPB"!

console.log(original); // { name: "John", address: { city: "SPB" } }

Оригинальный объект address остается общим для обеих копий.

Глубокое копирование

При глубоком копировании создается полная независимая копия:

const original = { name: "John", address: { city: "Moscow" } };
const deep = JSON.parse(JSON.stringify(original));

deep.address.city = "SPB";
console.log(original.address.city); // "Moscow"
console.log(deep.address.city); // "SPB"

Способы копирования

1. Spread оператор (неглубокое)

const obj = { a: 1, b: { c: 2 } };
const copy = { ...obj }; // неглубокое

2. Object.assign (неглубокое)

const copy = Object.assign({}, obj);

3. Array.slice() для массивов (неглубокое)

const arr = [1, [2, 3]];
const copy = arr.slice(); // неглубокое

4. JSON методы (глубокое, с ограничениями)

const deep = JSON.parse(JSON.stringify(obj));
// Минус: теряются функции, undefined, Date, Map, Set

5. structuredClone (глубокое, современный подход)

const deep = structuredClone(obj);
// Поддерживает Date, Map, Set, но не функции

6. Рекурсивное копирование (глубокое, универсальное)

function deepCopy(obj) {
  if (obj === null || typeof obj !== "object") return obj;
  if (obj instanceof Date) return new Date(obj);
  if (obj instanceof Array) return obj.map(item => deepCopy(item));
  if (obj instanceof Object) {
    const copy = {};
    for (const key in obj) {
      if (obj.hasOwnProperty(key)) {
        copy[key] = deepCopy(obj[key]);
      }
    }
    return copy;
  }
}

Сравнение методов

Практические примеры

Когда использовать неглубокое копирование:

// Быстрое создание новой ссылки для React
setState({ ...state, name: "Jane" });

Когда использовать глубокое копирование:

// Когда нужна полная независимость от оригинала
const userData = { profile: { settings: { theme: "dark" } } };
const backup = structuredClone(userData);
backup.profile.settings.theme = "light";
// userData.profile.settings.theme остается "dark"

Ключевые моменты

• Неглубокое копирование: быстрое, но вложенные объекты остаются общими
• Глубокое копирование: медленнее, но полная независимость
• Выбор метода: зависит от структуры данных и требований приложения
• structuredClone: рекомендуемый метод для современных браузеров