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的第一个参数传入的对象对新对象有直接的影响。

转载于:https://www.cnblogs.com/foxNike/p/6527493.html

相关资源：JavaScript对象拷贝与Object.assign用法实例分析