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

Аватар пользователя Ivan Gagarinov
Ivan Gagarinov
14 февраля 2023

Изначально в JS не закладывались механизмы глубокого клонирования объектов, но со временем появилось несколько способов:

JSON.parse и JSON.stringify

Этот способ использует преобразование объекта в строку с помощью JSON.stringify(), а затем преобразование строки в объект с помощью JSON.parse()

const sourceObj = {
  a: 'test1',
  b: {
    c: 'test2',
  },
};

const clonedObj = JSON.parse(JSON.stringify(sourceObj));

console.log(clonedObj);

Этот метод не работает в старых браузерах (например, в Internet Explorer 6). И он не копирует методы (функции в свойствах объекта).

structuredClone

Эта функция появилась в 17 версии NodeJS. Она клонирует объекты, но так же как и предыдущий вариант не работает с методами.

const sourceObj = {
  a: 'test1',
  b: {
    c: 'test2',
  },
};

const clonedObj = structuredClone(sourceObj);

console.log(clonedObj);

Использование сторонних библиотек

Есть библиотеки, которые предоставляют методы глубокого клонирования объекта, например lodash. В этой библиотеке есть метод cloneDeep, который клонирует так же и методы в объекте:

import _ from 'lodash';

const sourceObj = {
  a: 'test1',
  b: {
    c: () => console.log('hello'),
  },
};

const clonedObj = _.cloneDeep(sourceObj);

console.log(clonedObj);
44 0
Познакомьтесь с основами JavaScript бесплатно