StructuredClone() — нативное глубокое копирование в JS⁠⁠

Многие знают, что поверхностное копирование (const copy = obj) копирует только ссылку на объект, но не создаёт полноценную копию. Если изменить copy, изменится и исходный объект.

Для глубокого копирования раньше использовали JSON.parse(JSON.stringify()). Но у этого способа куча проблем: он не копирует Date, Map, Set, RegExp, undefined, падает на циклических ссылках и просто молча проглатывает функции.

Хотелось напомни , а некоторым и рассказать что существует другой более удобный и полезный способ ,глубокого копирования объекта.
structuredClone()-встроенный метод для глубокого копирования, который работает на уровне движка.

const original = {
name: "Мощный WEB",
date: new Date(),
map: new Map([['key', 'value']]),
set: new Set([1, 2, 3]),

arr: [1, 2, 3],
nested: { a: 1, b: 2 } };
const clone = structuredClone(original); // Теперь clone — это полноценная копия console.log(clone !== original); // true
console.log(clone.date instanceof Date); // true
console.log(clone.map instanceof Map); // true

Всё работает "из коробки": Map, Set, Date, ArrayBuffer, TypedArray, циклические ссылки.

Почему это лучше JSON.parse(JSON.stringify())

В отличие от устаревшего JSON-подхода, structuredClone() корректно обрабатывает циклические ссылки - там, где JSON.stringify() выбрасывает ошибку, новый метод спокойно создаёт копию. Он сохраняет типы данных: Date остаётся датой, а не превращается в строку, Map и Set остаются коллекциями, а не пустыми объектами. Значение undefined не пропадает, а копируется как есть, а RegExp сохраняет своё состояние, а не превращается в пустой объект. Единственное ограничение — функции не копируются: в JSON.parse(JSON.stringify()) они просто исчезают, а structuredClone() в таких случаях выбрасывает ошибку DataCloneError.

Все современные браузеры ,поддерживают данный метод.

Используйте ,его даже во времена AI и "Вайбкодинга", знать такие вещи необходимо.

Если интересны технологии веб-разработки ,подписывайте на мои каналы в Telegram и MAX.