Object.assign()的痛點

最近也一直會用javascript，然後中間使用的一些元件，如Echarts 會有非常複雜的配置檔案，而大部分配置可能都是一樣的，所以想著寫一份通用配置，然後，其他地方需要使用的時候，用這份配置深複製一份配置，然後在上面繼續改。就如下：

深複製和淺複製

這裡也涉及到一個深複製和淺複製的概念。javascript中儲存物件都是存地址的，所以淺複製是都指向同一塊記憶體區塊，而深複製則是另外開闢了一塊區域。下面例項也可以看出這一點：

可以明顯看出，淺複製在改變其中一個值時，會導致其他也一起改變，而深複製不會。

Object.assign()

我需要的是深複製的方法，然後發現原來es6 中有Object.assign() 這個方法，感覺可以拿來用了。

貼一下兩個官方例子：

 //1.

是不是很完美，又可以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

作者：飢人谷_米彌輪
連結：