javascript 中对象的深复制和浅复制

对象的浅复制

浅复制指的是源对象的属性如果有对象，该对象属性修改后，会引起复制后的对象各属性的改变，对象的浅复制有以下几种方式：

• for in，浅复制

let obj1={a:1,b:2,c:{d:3}}
let obj2={};
for(var prop in obj1){
    // 浅复制
    obj2[prop]=obj1[prop];
}
obj1.c.d=10;
console.log(obj1);//{a:1,b:2,c:{d:10}}
console.log(obj2);//{a:1,b:2,c:{d:10}}

• Object.assign()，浅复制

let obj1={a:1,b:2,c:{d:3}}
let obj2=Object.assign({},obj1);
obj1.c.d=10;
console.log(obj1);//{a:1,b:2,c:{d:10}}
console.log(obj2);//{a:1,b:2,c:{d:10}}

• let obj1={…obj}，浅复制，如果原obj1就存在，还会改变原obj1的引用地址

let obj1={a:1,b:2,c:{d:3}}
let obj2=obj1;
obj1.c.d=10;
console.log(obj1);//{a:1,b:2,c:{d:10}}
console.log(obj2);//{a:1,b:2,c:{d:10}}

对象的深复制（一）

• JSON.parse(JSON.stringify())，虽然可以实现对象的深复制，但是对于部分数据类型的复制还是有些问题。

let obj1={a:1,b:2,c:{d:3},e:new Date()}
var obj2=JSON.parse(JSON.stringify(obj1));
obj1.c.d=10;
console.log(obj2,obj1);//打印的结果如下

对象的深复制（二）

• 深复制，源对象的属性如果有对象，该对象属性修改后，不会引起复制后的对象各属性的改变；
• 源对象的任何属性及子属性与新对象的直接没有任何引用关系；

声明一个对象：

var obj = {
    a: 1,
    b: "a",
    c: true,
    d: function (a, b) {
        if (a > 10) a = 10;
        if (b > 5) {
            b = 5;
        } else if (b < 0) {
            b = 0;
        }
        console.log(a + b);
    },
    e: [1, 2, 3, 4],
    f: {
        g: ["a", "b", "c"],
        h: new Date(),
        i: /^[a-z]+$/g,
        j: {
            k: {

            },
            l: [true, false],
            m: [
                { id: 1001, name: "abc1" },
                { id: 1002, name: "abc2" },
                { id: 1003, name: "abc3" }
            ]
        }
    }
}
Object.defineProperties(obj.f.j, {
    n: {
        value: function () {
            console.log("abcd");
        }
    },
    o: {
        value: 10,
        enumerable: true
    },
    p: {
        value: [1, 2, 3],
        writable: true
    },
    q: {
        value: true,
        writable: true,
        enumerable: true
    }
});


Object.defineProperties(obj.f.j.k, {
    r: {
        value: function () {

        },
        writable: true
    },
    s: {
        value: { a: 1 },
        enumerable: true
    }
});

对象的深复制：

function cloneObject(sourceObj, targetObj) {
    if (!targetObj) {
        // sourceObj.constructor就是 sourceObj的类型
        // 如果sourceObj是数组  则sourceObj.constructor->Array
        //targetObj = new Array();
        targetObj=new sourceObj.constructor();
        switch (sourceObj.constructor) {
            case RegExp:
            	//new RegExp(正则语句，修饰符)
                targetObj=new RegExp(sourceObj.source,sourceObj.flags);
                break;
            case Date:
                targetObj=new Date(sourceObj);
                break;
        }
    }
    //获取到该对象的所有属性集合
    var names = Object.getOwnPropertyNames(sourceObj);
    for (var i = 0; i < names.length; i++) {
    	//获取属性的描述对象
        var desc = Object.getOwnPropertyDescriptor(sourceObj, names[i]);
        if (typeof desc.value === "object") {
        	//进行递归
            var o = cloneObject(desc.value);
            //设置属性的描述对象
            Object.defineProperty(targetObj, names[i], {
                enumerable: desc.enumerable,
                configurable: desc.configurable,
                writable: desc.writable,
                value: o
            });
        } else if (typeof desc.value === "function") {
        	//获取到函数中的参数和函数的内容
            var fnStr = desc.value.toString().replace(/\n/g, "");
            var arg = fnStr.match(/\((.*?)\)/)[1];
            var content = fnStr.match(/{(.*)}/)[1];
            //new Function(参数, 执行语句)
            var fn = new Function(arg, content);
            //设置属性的描述对象
            Object.defineProperty(targetObj, names[i], {
                enumerable: desc.enumerable,
                configurable: desc.configurable,
                writable: desc.writable,
                value: fn
            });
        } else {
        	//设置属性的描述对象
            Object.defineProperty(targetObj, names[i], desc);
        }
    }
    return targetObj;
}

调用：

var obj1 = cloneObject(obj);