Зачем использовать JSON при клонировании объекта?

JSON метод клонирования объектов

JSON.parse и JSON.stringify — это простой способ создать глубокую копию объекта в JavaScript. Суть метода в том, что мы сначала преобразуем объект в строковое представление JSON, а затем парсим эту строку обратно в объект. Оригинальный объект и его копия полностью независимы друг от друга.

Как это работает

const original = {
  name: "John",
  age: 30,
  address: {
    city: "New York",
    zip: "10001"
  },
  hobbies: ["reading", "coding", "gaming"]
};

// Создание глубокой копии через JSON
const cloned = JSON.parse(JSON.stringify(original));

// Изменяем копию
cloned.address.city = "Los Angeles";
cloned.hobbies.push("swimming");

console.log(original.address.city); // "New York" — не изменился
console.log(original.hobbies.length); // 3 — не изменился
console.log(cloned.address.city); // "Los Angeles"
console.log(cloned.hobbies.length); // 4

Преимущества метода

Простота и читаемость — код понятен с первого взгляда, не требует дополнительных библиотек.

Глубокое копирование — в отличие от поверхностного копирования (Object.assign, спред-оператор), JSON метод копирует все вложенные объекты и массивы.

Производительность для малых объектов — для простых структур данных это быстро и эффективно.

Встроенный в язык — не нужно импортировать библиотеки или писать собственную рекурсивную функцию.

Ограничения

const problematic = {
  date: new Date(),
  func: () => console.log("hello"),
  regex: /test/gi,
  undefined: undefined,
  symbol: Symbol("id")
};

const cloned = JSON.parse(JSON.stringify(problematic));

console.log(cloned.date); // "2026-04-02T12:00:00.000Z" — строка, не Date
console.log(cloned.func); // undefined — функции теряются
console.log(cloned.regex); // {} — RegExp становится пустым объектом
console.log(cloned.undefined); // undefined отсутствует в объекте
console.log(cloned.symbol); // Symbol отсутствует в объекте

Функции не клонируются — они просто игнорируются при JSON.stringify.

Специальные объекты теряют тип — Date, RegExp, Map, Set преобразуются в простые объекты или строки.

undefined и Symbol удаляются — они не сериализуются в JSON.

Циклические ссылки вызывают ошибку:

const circular = { name: "John" };
circular.self = circular;
JSON.stringify(circular); // TypeError: Converting circular structure to JSON

Когда использовать

JSON метод идеален для:

• Простых объектов с примитивными значениями
• Объектов, содержащих вложенные массивы и объекты
• Когда нужна полная изоляция копии от оригинала
• В Redux и других state management системах

Не подходит для:

• Объектов с функциями
• Объектов со специальными типами (Date, RegExp, Map, Set)
• Больших объектов, где производительность критична
• Объектов с циклическими ссылками

Альтернативные подходы

// structuredClone — современный метод
const cloned = structuredClone(original);

// Рекурсивное копирование для сложных случаев
function deepClone(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 => deepClone(item));
  if (obj instanceof Object) {
    const cloned = {};
    for (const key in obj) {
      if (obj.hasOwnProperty(key)) {
        cloned[key] = deepClone(obj[key]);
      }
    }
    return cloned;
  }
}

Заключение

JSON.parse(JSON.stringify()) — практичный и надежный метод для глубокого клонирования объектов в JavaScript, если объект содержит только сериализуемые данные. Это широко используется в фронтенд-разработке и state management. Однако нужно понимать его ограничения и выбирать альтернативные методы, когда работаешь со сложными типами данных.