js对象的浅拷贝与深拷贝

浅拷贝

• 将对象中的第一层数据都复制一份 赋值给另一个空对象
• 两个对象中的第一层值都一样
• 修改拷贝对象第一层的值不会影响到原对象
• 可以通过遍历对象或展开运算符（…）完成浅拷贝

    var o = {
        a: 1,
        b: 2,
        info1: {
            c: 3,
            d: 4,
            info2: {
                e: 5,
                f: 6,
            }
        }
    }
    var obj = {}
    for (var key in o) {
        obj[key] = o[key]
    }
    obj['a'] = 123
    obj['b'] = 666
    obj['info1']['c'] = 777
    obj['info1']['info2']['f'] = 999
    console.log(obj, o)

通过运行结果我们可以看到拷贝对象修改第一层的值不会影响到原对象
而修改第二三层的值会影响到原对象（因为对象拷贝时传输的是地址）

深拷贝

• 对象无论多少层 都将数据拷贝到新的对象中
• 拷贝完成后,无论怎么改变新对象中的数据,都不会影响原来的对象
• 可以通过递归函数来完成深拷贝

    var o = {
        a: 1,
        b: 2,
        info1: {
            c: 3,
            d: 4,
            info2: {
                e: 5,
                f: 6,
            }
        }
    }
    var obj = {}

    function deepCopy(o1, o2) {
        for (var key in o1) {
            if (Object.prototype.toString.call(o1[key]) === '[object Object]') {
                o2[key] = new Object()
                deepCopy(o1[key], o2[key])
            } else {
                o2[key] = o1[key]
            }
        }
    }

    deepCopy(o, obj)

    obj['a'] = 123
    obj['b'] = 666
    obj['info1']['c'] = 777
    obj['info1']['info2']['f'] = 999
    console.log(obj, o)

我们可以看到，通过深拷贝后，拷贝对象的修改不会影响到原对象