> Как реализовать глубокое клонирование объекта в JavaScript? (JavaScript)

Уровень: senior · Роль: frontend · Категория: Технические вопросы

Компании: МТГ Бизнес решения, EPAM

Стек: JavaScript

> Пример ответа

Для глубокого клонирования объекта в JavaScript можно использовать несколько подходов. Самый простой и современный способ - structuredClone(), который работает с большинством типов данных, включая вложенные объекты, массивы, Date, Map, Set и даже циклические ссылки:

JAVASCRIPT
const original = { name: 'Alice', data: { age: 30, tags: ['a', 'b'] } };
const clone = structuredClone(original);

Если требуется поддержка старых браузеров, можно использовать комбинацию JSON.parse(JSON.stringify(obj)), но этот метод теряет функции, undefined, Symbol, специальные объекты (например, Date превращается в строку) и не поддерживает циклические ссылки.

Для более гибкого решения подходит рекурсивная функция, которая обрабатывает различные типы:

JAVASCRIPT
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));
  const clonedObj = {};
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      clonedObj[key] = deepClone(obj[key]);
    }
  }
  return clonedObj;
}

Также можно использовать библиотеки, например lodash.cloneDeep(). Выбор метода зависит от требований к производительности, поддерживаемых типов данных и окружения.