tgoop.com/frontendInterview/4180
Create:
Last Update:
Last Update:
Как можно скопировать объект в JS?
Есть несколько способов скопировать объект. Важно понимать разницу между поверхностным (shallow) и глубоким (deep) копированием. Поверхностная копия копирует только сам объект и его непосредственные свойства, в то время как глубокая копия копирует весь объект и все его вложенные объекты.
Поверхностное копирование
1. Метод Object.assign копирует все перечисляемые свойства из одного или более исходных объектов в целевой объект.
const original = { a: 1, b: 2 };
const copy = Object.assign({}, original);
console.log(copy); // { a: 1, b: 2 }
2. Оператор расширения (
...) также можно использовать для создания поверхностной копии объекта.const original = { a: 1, b: 2 };
const copy = { ...original };
console.log(copy); // { a: 1, b: 2 }
Глубокое копирование
1. JSON.parse и JSON.stringify
Этот метод преобразует объект в строку JSON, а затем обратно в объект, создавая тем самым глубокую копию. Однако он имеет ограничения, такие как невозможность копирования функций и потеря
undefined значений.const original = { a: 1, b: { c: 2 } };
const copy = JSON.parse(JSON.stringify(original));
console.log(copy); // { a: 1, b: { c: 2 } }
2. Рекурсивная функция
Можно написать свою рекурсивную функцию для глубокого копирования объекта.
function deepCopy(obj) {
if (obj === null || typeof obj !== 'object') {
return obj;
}
if (Array.isArray(obj)) {
const arrCopy = [];
for (let i = 0; i < obj.length; i++) {
arrCopy[i] = deepCopy(obj[i]);
}
return arrCopy;
}
const copy = {};
for (const key in obj) {
if (obj.hasOwnProperty(key)) {
copy[key] = deepCopy(obj[key]);
}
}
return copy;
}
const original = { a: 1, b: { c: 2 } };
const copy = deepCopy(original);
console.log(copy); // { a: 1, b: { c: 2 } }
3. Библиотеки для глубокого копирования
Существуют библиотеки, такие как lodash, которые предоставляют готовые функции для глубокого копирования объектов.
const _ = require('lodash');
const original = { a: 1, b: { c: 2 } };
const copy = _.cloneDeep(original);
console.log(copy); // { a: 1, b: { c: 2 } }
👉 @frontendInterview
BY Frontend Interview - собеседования по Javascript / Html / Css
Share with your friend now:
tgoop.com/frontendInterview/4180