Object.assign

Object.assign(target, ...source)

target

目标对象

source

组成对象

用途

• 对象的克隆(新对象与被克隆的对象不会互相影响)

var aa = { name: 'zgatry' };
var bb = Object.assign({}, aa);
bb.name = 'aoao';
console.log(aa, bb);    //{ name: 'zgatry' }, { name: 'aoao' }

但是这种克隆方式仍无法达到深克隆的效果。请看下面的代码：

var aa = { cc: { dd: 11 }, ee: { ff: 22 } };
var bb = Object.assign({}, aa);
bb.ee.ff = 33;
console.log(aa, bb);    //{ cc: { dd: 11 }, ee: { ff: 33 } }, { cc: { dd: 11 }, ee: { ff: 33 } }

也就是说，Object.assign只是复制了某个对象的值，如果复制的值为引用类型，那么其实就是复制了该引用。当改变引用所指向的存储空间的值时，被克隆对象的这一部分的值也改变了。

可以使用如下方式实现深度克隆:

var aa = {name: 'zgatry'};
var hh = JSON.parse(JSON.stringify(aa));
aa.name = 'aoao';
console.log(hh.name);    //zgatry

var aa = { cc: { dd: 22 } };
var hh = JSON.parse(JSON.stringify(aa));
aa.cc.dd = 33;
console.log(hh.cc.dd);    //22

可以看到，通过JSON.parse(JSON.stringify())的方式就能够达到深克隆的目的。

• 合成对象

其实和第一种用途的形式类似，只不过现在传的第一个参数不再是一个空对象。

var a = { age: 18, name: 'zgatry' };
var b = { age: 17 };
var c = { age: 16};

var aa = Object.assign(a, b, c);    //{ age: 16, name: 'zgatry' }

a.name = 'aoao';
aa.name;    //aoao

查看控制台输出可以发现，合并的对象中，重复的属性被后面的参数覆盖，不同的属性保留下来，插入到新对象中。

注意：这里同样存在对象克隆的说明中的问题，而且，Object.assign的第一个参数传入的对象对新对象有直接的影响。