js深度复制方法总结

想理解js深度复制，一定要理解JS的内存管理，我们知道JS拥有自动的垃圾回收机制，这样就使得很多前端开发人员不是很重视内存管理这一块。但是其实这一部分的内容对于理解JS中原型与原型链，闭包，递归都是非常有帮助的。
在JS中，每一个数据都需要一个内存空间。内存空间又被分为两种：栈内存(stock) 堆内存(heap)
关于原理，这篇博文讲的非常详细：
https://www.jianshu.com/p/2a3728cded4c?utm_campaign=maleskine&utm_content=note&utm_medium=reader_share&utm_source=weixin
下面是我总结的一些深度拷贝函数

1. 除了递归，我们还可以借用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);

这个方法虽然可以解决绝大部分是使用场景,但是却有很多坑.
1.他无法实现对函数 、RegExp等特殊对象的克隆;
2.会抛弃对象的constructor,所有的构造函数会指向Object;
3.对象有循环引用,会报错;

2. 递归（比较简单的一种，不是最好的）

function deepClone(obj){
    let objClone = Array.isArray(obj)?[]:{};
    if(obj && typeof obj==="object"){
        for(key in obj){
            if(obj.hasOwnProperty(key)){
                //判断ojb子元素是否为对象，如果是，递归复制
                if(obj[key]&&typeof obj[key] ==="object"){
                    objClone[key] = deepClone(obj[key]);
                }else{
                    //如果不是，简单复制
                    objClone[key] = obj[key];
                }
            }
        }
    }
    return objClone;
}    
let a=[1,2,3,4],
    b=deepClone(a);
a[0]=2;
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);

4. 考虑了栈和堆的思想；其思路是：引入一个数组 uniqueList 用来存储已经拷贝的数组，每次循环遍历时，先判断对象是否在 uniqueList 中了，如果在的话就不执行拷贝逻辑了。

function cloneForce(x) {
    // 用来去重
    const uniqueList = [];
    let root = {};
    // 循环数组
    const loopList = [{parent: root,key: undefined,data: x}];
    while(loopList.length) {
        // 深度优先
        const node = loopList.pop();
        const parent = node.parent;
        const key = node.key;
        const data = node.data;
        // 初始化赋值目标，key为undefined则拷贝到父元素，否则拷贝到子元素
        let res = parent;
        if (typeof key !== 'undefined') {
            res = parent[key] = {};
        }
        // 数据已经存在
        let uniqueData = uniqueList.find((item) => item.source === data );
        if (uniqueData) {
            parent[key] = uniqueData.target;
            // 中断本次循环
            continue;
        }
        // 数据不存在
        // 保存源数据，在拷贝数据中对应的引用
        uniqueList.push({source: data,target: res,});
        for(let k in data) {
            if (data.hasOwnProperty(k)) {
                if (typeof data[k] === 'object') {
                    // 下一次循环
                    loopList.push({parent: res,key: k,data: data[k]});
                } else {
                    res[k] = data[k];
                }
            }
        }
    }

    return root;
}

5.loadsh——生产环境中最好用的深克隆