Object.assign()的痛点

最近也一直会用javascript，然后中间使用的一些组件，如Echarts 会有非常复杂的配置文件，而大部分配置可能都是一样的，所以想着写一份通用配置，然后，其他地方需要使用的时候，用这份配置深拷贝一份配置，然后在上面继续改。就如下：

深拷贝和浅拷贝

这里也涉及到一个深拷贝和浅拷贝的概念。javascript中存储对象都是存地址的，所以浅拷贝是都指向同一块内存区块，而深拷贝则是另外开辟了一块区域。下面实例也可以看出这一点：

可以明显看出，浅拷贝在改变其中一个值时，会导致其他也一起改变，而深拷贝不会。

Object.assign()

我需要的是深拷贝的方法，然后发现原来es6 中有Object.assign() 这个方法，感觉可以拿来用了。

贴一下两个官方例子：

 //1.


 //2.

是不是很完美，又可以clone又可以merge。在我这种情况下，我觉得我的代码量又可以减少了，比如：

不过，很快，问题出现了，那就是

merge和我想象的不一样

原本想的是它只会覆盖subtext ，然而其实它直接覆盖了整个title ，这个让我比较郁闷，相当于它只merge根属性，下面的就不做处理了。

代码只能重构成相对麻烦一点的：

这样用虽然麻烦一点，但是也还好，可以用了。不过。。。很快，又出现问题了，如下：

上面结果发现两个配置变得一模一样，而其实我们并没有去更改opt1 的subtext ，只是改了opt2 的。

这说明一点：在title 这一层只是简单的浅拷贝 ，而没有继续深入的深拷贝。
这里不经让我怀疑这个接口到底是怎么实现的，它到底是不是和我所想的一样。
翻了一下官方文档，发现它写得一个Polyfill ，代码我加了点注释如下：

上面的代码可以直接说明它只对顶层属性做了赋值，完全没有继续做递归之类的把所有下一层的属性做深拷贝。

总结

Object.assign()

只是一级属性复制，比浅拷贝多深拷贝了一层而已。用的时候，还是要注意这个问题的。

附

发现一个可以简单实现深拷贝的方法，当然，有一定限制，如下：

const obj1 = JSON.parse(JSON.stringify(obj));

思路就是将一个对象转成json字符串，然后又将字符串转回对象。

转载至：http://blog.csdn.net/waiterwaiter/article/details/50267787