JS深拷贝实现的三种方法

对象的深拷贝

会另外创建一个一模一样的对象，新对象和原对象不共享内存，修改新对象不会影响原对象

1. 递归

    function deepClone(obj){
//      定义一个变量 并判断是数组还是对象
        var objClone = Array.isArray(obj) ? [] : {};
        if(obj && typeof obj === "object" && obj != null){ 
 // 判断obj存在并且是对象类型的时候 因为null也是object类型，所以要单独做判断
            for(var key in obj){  // 循环对象类型的obj
                if(obj.hasOwnProperty(key)){  // 判断obj中是否存在key属性
                    if(obj[key] && typeof obj[key] === "object"){  //  判断如果obj[key]存在并且obj[key]是对象类型的时候应该深拷贝，即在堆内存中开辟新的内存
                        objClone[key] = deepClone(obj[key]);
                    }else{  //  否则就是浅复制
                        objClone[key] = obj[key];
                    }
                }
            }
        }
        return objClone;
    }
    var a = {
        name:"key1",
        eat:["苹果","香蕉"]
    }
    b = deepClone(a);
//    console.log(b);
    a.eat = ["苹果","香蕉","橙子"];
    console.log(a);  //  {name:"key1",eat:["苹果","香蕉","橙子"]}
    console.log(b)   //  {name:"key1",eat:["苹果","香蕉"]}

递归运行效率低，次数过多的话容易造成栈溢出。

2. JSON的parse和stringify方法

function deepClone(obj){
//        console.log(obj);
//        console.log(typeof obj);
        var _obj = JSON.stringify(obj);  //  对象转成字符串
//        console.log(_obj);
//        console.log(typeof _obj);
        var objClone = JSON.parse(_obj); //  字符串转成对象
//        console.log(objClone);
//        console.log(typeof objClone);
        return objClone;
    }
    var a = [0,1,[2,3],4];
    b = deepClone(a)
    a[0] = 6;
    a[2][0] = 7;
    console.log(a);   //  [6,1,[7,3],4]
    console.log(b);   //  [0,1,[2,3],4]

3. Jquery的$.extend

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

//$.extend参数：
//第一个参数是布尔值，是否深复制
//第二个参数是目标对象，其他对象的成员属性将被附加到该对象上
//第三个及以后的参数是被合并的对象