1. 程式人生 > >JavaScript深拷貝實現原理簡析

JavaScript深拷貝實現原理簡析

不出 附加 als 實現 code == 除了 目標 ring

Why: 引用類型拷貝為了不出現數據共享問題,需要使用深拷貝。

So:

1.內部原理:

 1 function inCopy(obj1,obj2) {
 2     var obj1 = obj1 || {};//容錯處理
 3     for (var k in obj2) { 
 4         if(obj2.hasOwnProperty(k)){ //只拷貝實例屬性,不進行原型的拷貝
 5             if(typeof obj2[k] == ‘object‘) { //引用類型的數據單獨處理
 6                 obj1[k] = Array.isArray(obj2[k])?[]:{};
7 inCopy(obj1[k],obj2[k]); //遞歸處理引用類型數據 8 }else{ 9 obj1[k] = obj2[k]; //值類型的數據直接進行拷貝 10 } 11 } 12 } 13 }

2. 除了遞歸,我們還可以借用JSON對象的parse和stringify:

function deepClone(obj){
    let _obj = JSON.stringify(obj),
        objClone = JSON.parse(_obj);
    
return objClone } let a=[0,1,[2,3],4], b=deepClone(a); a[0]=1; a[2][0]=1; console.log(a,b);

3.除了上面兩種方法之外,我們還可以借用JQ的extend方法。

$.extend( [deep ], target, object1 [, objectN ] )

deep表示是否深拷貝,為true為深拷貝,為false,則為淺拷貝

target Object類型 目標對象,其他對象的成員屬性將被附加到該對象上。

object1 objectN可選。 Object類型 第一個以及第N個被合並的對象。

let a=[0,1,[2,3],4],
    b=$.extend(true,[],a);
a[0]=1;
a[2][0]=1;
console.log(a,b);

可以看到,效果與上面方法一樣,只是需要依賴JQ庫。

JavaScript深拷貝實現原理簡析