JS对象浅拷贝与深拷贝方法

JS 对象浅拷贝是将对象的属性和值复制出来给另一个对象，可能没有将对象的所有层级的属性复制，新对象的属性的引用地址可能与原对象相同。而深拷贝就是将对象完全复制一份，复制出来的对象与原对象具有相同层级的属性和值，并且新对象的属性拥有独立的引用地址。

假设声明以下对象：

var obj = {
  a: 1,
  b: 'abc',
  c: [1, 2, 3],
  d: {
    e: 4,
    f: 'efg',
    g: [4, 5, 6]
  }
}

1.通过循环遍历拷贝

var objCopy = {};

for (var k in obj) {
  objCopy[k] = obj[k];
}

2.使用 Object.keys 遍历拷贝

var objCopy = {};

Object.keys(obj).forEach(function(key) {
  objCopy[key] = obj[key];
});

3、使用 ES6 Object.assign() 方法拷贝

var objCopy = Object.assign({}, obj);

// 修改新对象的属性值
objCopy.a = 2;
objCopy.c.push(4);
objCopy.d.e = 5;

console.log(objCopy.a);
// > 2
console.log(obj.a);
// > 2
console.log(objCopy.c);
// > [1, 2, 3, 4]
console.log(obj.c);
// > [1, 2, 3, 4]
console.log(objCopy.d.e);
// > 5
console.log(obj.d.e);
// > 5

由上面的结果可见，通过 Object.assign() 方法只是拷贝了对象的第一层属性，并且对于新对象与原对象的属性的引用地址相同。

4.使用 JSON.parse(JSON.stringfy()) 拷贝

var objCopy = JSON.parse(JSON.stringfy(obj));

5.深拷贝/深克隆函数

function deepClone(obj) {
    var result;

    if (typeof obj !== 'object' || obj === null) {
        result = obj;
    } else {
        result = Array.isArray(obj) ? [] : {};

        for (var key in obj) {
            if (obj.hasOwnProperty(key)) {
                result[key] = deepClone(obj[key]);
            }
        }
    }

    return result;
}