js實現數組、對象深度克隆的兩種辦法

1.深度克隆的原理

JS中的深度克隆，指的是原對象改變了，克隆出來的新對象也不會改變，原對象與新對象是完全獨立的關系。

實現深度克隆的原理得從對象是一種引用類型說起

眾所周知，對象是一種引用類型，對象的地址指針存放於棧中，而對象實際的數據存放於堆中。

因此當我們簡單地執行復制操作時，實際是把地址指針進行了復制操作，因此在對象的實際數據改變之后，新老對象都會受到影響。

那么如何讓他不受到影響呢？

答案是利用基本數據類型的特點，基本類型在執行復制操作后，新老數值之間不會互相產生影響

所以，我們要對對象不斷進行分解，直到其是基本數據類型之后，再進行復制操作。

2.實現方法

2.1 硬剛法（迭代法，適用於所有）

// 方法一 利用迭代
// 思路是：判定要克隆的對象是不是引用類型，如果是引用類型，則繼續迭代,如果該項是基本類型，則直接復制。
function deepClone(obj){
    let newObj=Array.isArray(obj)?[]:{}

    if(obj&&typeof obj ==="object"){
        for(let key in obj){
            if(obj.hasOwnProperty(key)){
                newObj[key]=(obj && typeof obj[key]==='object')?deepClone(obj[key]):obj[key];
            }
        }
    }
    return newObj
}

let a=[{c:1},2,3,4],
b=deepClone(a);
a[0]={c:2};
console.log(a,b);

2.2 投機取巧法（Json方法，適用於部分）

//方法2  利用JSON對象的方法
//主要是利用JSON.stringify和JSON.parse,這種辦法只能實現純數據的克隆，如果存在function則會直接忽略，不會進行復制操作

function deepClone2(obj){
    return JSON.parse(JSON.stringify(obj))
}

let a1={a: 1, b: function() {}}
b1=deepClone2(a1);
console.log(a1,b1);