ES 6の拡張演算子について深くコピーします.

3923 ワード

多くのブログでES 6の拡張演算子****も対象を深くコピーすることができると言っていますが、実はピットがあります.
オブジェクトの一般的なフォーマットは以下の通りです.
// key  ,value  
let obj = { key :value }
  • において、valueは基本的なデータタイプであり、例えば、String、Number、Booleanのような場合、拡張演算子を使用して、深くコピーすることができる.
  • // value       
    let oldObj = { id: 1 }
    let newObj = { ...oldObj }
    
    oldObj.id = 2
    
    console.log(oldObj) // {id: 2}
    console.log(newObj) // {id: 1} //    oldObj      
    
  • しかし、valueが参照タイプである場合、例えばObject、Arayのように、拡張演算子を使って深くコピーし、結果としては和深コピーの概念に矛盾がある.主に引用タイプが深いコピーをしても引用アドレスをコピーしただけです.
  • // value     
    let oldObj = { type: { id: 1 } }
    let newObj = { ...oldObj } //      {id : 1}     
    
    oldObj.type.id = 2 //           
    
    console.log(oldObj) // {type: {id: 2}}
    console.log(newObj) // {type: {id: 2}}   oldObj      
    
    oldObj.type = { id: 3 } //        ,            
    
    console.log(oldObj) // {type: {id: 3}}
    console.log(newObj) // {type: {id: 2}}    oldObj      
    
    まとめ:深いコピーはlodashのclone Deep方法またはJSONデータ変換を使って、Javascriptを参考にして深くコピーしたほうがいいです.