相信大多數人在`vue`中都遇到過一個問題，就是對象變量`a`賦值給一個新的變量`b`，在修改`b`屬性時 `a`也被修改了 <br/> 這個準確的說不是`vue`的特點, 而是`js`的，估計是為了性能和效率優化，當對象變量賦值時，傳遞的是`引用`，相當于兩個變量指向共同一個內存地址； <br/> <br/> 所以導致了， 上述問題的發生； 然而在js的`5個基礎類型`中并不會使用`引用賦值`， 而且解決辦法就是用`深淺拷貝` ## 淺拷貝 ```javascript Object.assign() ``` 如果我沒記錯的話， 好像是`es6`的特性， 瀏覽器要考慮ie和老舊瀏覽器解釋引擎的問題； `nodejs` `typescript`之類的不用考慮， 他們會經過一個編譯的工序使其兼容較早的`es`規范 <br/> <br/> **使用示例** ``` let test = { name: 66, sex:0} let woc = Object.assign({}, test) woc.sex = 7 console.log(woc) console.log(test) ---- { name: 66, sex: 7 } { name: 66, sex: 0 } ``` **注意**：叫`淺拷貝`是有原因的， 它只能讓一維屬性不采用`引用方式`，如果你的對象中包涵`對象、數組`請使用深拷貝 ## 深拷貝 ```javascript JSON.stringify() JSON.parse() ``` 把對象變量轉換成字符串， 再解析給另一個變量。 完全重新解析的， 自己申請開辟內存空間，就是感覺上不怎么優雅； ```javascript let test = { name: 66, sex:0} let woc = JSON.parse(JSON.stringify(test)) woc.sex = 5 console.log(woc) console.log(test) --- { name: 66, sex: 5 } { name: 66, sex: 0 } ```