新聞中心
在JavaScript中,拷貝對象是一個常見的操作,根據(jù)拷貝的深度,我們可以將拷貝分為淺拷貝和深拷貝。

創(chuàng)新互聯(lián)公司是一家專業(yè)提供瑤海企業(yè)網站建設,專注與網站制作、做網站、H5高端網站建設、小程序制作等業(yè)務。10年已為瑤海眾多企業(yè)、政府機構等服務。創(chuàng)新互聯(lián)專業(yè)網站制作公司優(yōu)惠進行中。
淺拷貝:創(chuàng)建一個新對象,這個對象有著原始對象屬性值的一份精確拷貝,如果屬性是基本類型,拷貝的就是基本類型的值;但如果屬性是引用類型,拷貝的就是內存地址(即引用)的一份拷貝,如果其中一個對象改變了引用類型的屬性,另一個對象的該屬性也會受到影響。
深拷貝:創(chuàng)建一個新對象,和原始的對象不共享內存,修改新對象不會影響原始對象,反之亦然。
接下來,我會詳細解釋如何在JavaScript中進行淺拷貝和深拷貝。
淺拷貝
1. Object.assign() 方法
Object.assign() 方法用于將所有可枚舉屬性的值從一個或多個源對象復制到目標對象,它將返回目標對象。
let obj1 = { a: 1, b: 2, c: { d: 3 } };
let obj2 = Object.assign({}, obj1);
obj2.c.d = 4;
console.log(obj1.c.d); // 輸出 4,因為 obj2.c 和 obj1.c 指向同一個對象
2. 擴展運算符
擴展運算符(…)允許一個表達式在某處展開,當用于對象時,它會生成由對象的所有可枚舉鍵值對組成的數(shù)組。
let obj1 = { a: 1, b: 2, c: { d: 3 } };
let obj2 = { ...obj1 };
obj2.c.d = 4;
console.log(obj1.c.d); // 輸出 4,因為 obj2.c 和 obj1.c 指向同一個對象
深拷貝
1. JSON.parse() 和 JSON.stringify()
這是最簡單的深拷貝實現(xiàn)方式,但它有局限性,例如不能處理函數(shù)和循環(huán)引用。
let obj1 = { a: 1, b: 2, c: { d: 3 } };
let obj2 = JSON.parse(JSON.stringify(obj1));
obj2.c.d = 4;
console.log(obj1.c.d); // 輸出 3,因為 obj2.c 是 obj1.c 的一個全新副本
2. 遞歸方法
通過遞歸遍歷對象的所有屬性,如果屬性值是對象,則遞歸調用深拷貝函數(shù)。
function deepClone(obj, hash = new WeakMap()) {
if (obj instanceof RegExp) return new RegExp(obj);
if (obj instanceof Date) return new Date(obj);
if (obj === null || typeof obj !== 'object') return obj;
if (hash.has(obj)) return hash.get(obj);
const result = Array.isArray(obj) ? [] : {};
hash.set(obj, result);
for (let key in obj) {
if (Object.prototype.hasOwnProperty.call(obj, key)) {
result[key] = deepClone(obj[key], hash);
}
}
return result;
}
let obj1 = { a: 1, b: 2, c: { d: 3 } };
let obj2 = deepClone(obj1);
obj2.c.d = 4;
console.log(obj1.c.d); // 輸出 3,因為 obj2.c 是 obj1.c 的一個全新副本
3. Lodash 庫的 _.cloneDeep() 方法
Lodash 是一個提供了一致性、自定義性、性能和實用性的工具庫,它的 _.cloneDeep() 方法可以用于創(chuàng)建對象的深拷貝。
const _ = require('lodash');
let obj1 = { a: 1, b: 2, c: { d: 3 } };
let obj2 = _.cloneDeep(obj1);
obj2.c.d = 4;
console.log(obj1.c.d); // 輸出 3,因為 obj2.c 是 obj1.c 的一個全新副本
在進行深拷貝時,選擇哪種方法取決于具體需求和場景,簡單的數(shù)據(jù)結構可以使用 JSON.parse() 和 JSON.stringify(),而復雜的數(shù)據(jù)結構可能需要使用遞歸方法或第三方庫如 Lodash。
網頁名稱:js深拷貝淺拷貝怎么操作
本文鏈接:http://www.fisionsoft.com.cn/article/dhodjeg.html


咨詢
建站咨詢
