复合数据类型进行深拷贝浅谈

复合数据类型进行深拷贝浅谈

最近做项目时，碰到用到复合数据类型进行对比，需要保留最开始的值和最后的值进行对比，用到深拷贝，正好好好总结一下

虽有javascript没有堆栈的说法，但是却一直被应用。开始进入分析，剖析

数组进行深拷贝

let arr = [1, 2, 3, 4, 'sinosaurus']

• 1.使用slice

let newArr = arr.slice(0)
console.log(newArr) //   [1, 2, 3, 4, "sinosaurus"]
newArr[0] = 77  
console.log(newAr) //  [77, 2, 3, 4, "sinosaurus"]
console.log(arr)  //   [1, 2, 3, 4, "sinosaurus"]

• 1. 使用es6扩展运算符结合解构赋值

let [...newArr1] = arr
console.log(newArr1)  // [1, 2, 3, 4, "sinosaurus"]
newArr1[0] = 77
console.log(newArr1)  // [77, 2, 3, 4, "sinosaurus"]
console.log(arr)      // [1, 2, 3, 4, "sinosaurus"]

若是数组变复杂了，则数组的方法无法解决

let arr = [{s: '当时明月在，曾照彩云归', zhen: '两个黄鹂鸣翠柳，我还没有女朋友'}]

若是继续使用刚才的方法，会发现修改数组中对象的值，会影响其他的原始的数据，牵一发而动全身，因而考虑换其他方法

let [...newArr] = arr
console.log(newArr) //  [{s: '当时明月在，曾照彩云归', zhen: '两个黄鹂鸣翠柳，我还没有女朋友'}]
newArr.zhen = '十年生死两茫茫，不思量，自难忘'
console.log(newArr)  // [{s: '当时明月在，曾照彩云归', zhen: '十年生死两茫茫，不思量，自难忘'}]
console.log(arr)     // [{s: '当时明月在，曾照彩云归', zhen: '十年生死两茫茫，不思量，自难忘'}]
//另一个方法依旧如此

因而考虑其他方式

• 封装函数 (这种才算的上真正意义上的深拷贝) 虽然是复合数据类型，但是最终还是不同的简单数据类型进行结合的

function deepCopy(o1, o2) {
    //判断顺序， 数组 ==> 对象==> 浅拷贝
    for (let key in o1) {
      if (o1[key] instanceof Array) {
        o2[key] = []
        deepCopy(o1[key], o2[key])
      } else if (o1[key] instanceof Object) {
        o2[key] = {}
        deepCopy(o1[key], o2[key])
      } else {
        o2[key] = o1[key]
      }
    }
}
let newArr2 = []
deepCopy(arr, newArr2)
console.log(newArr2) // [{s: '当时明月在，曾照彩云归', zhen: '两个黄鹂鸣翠柳，我还没有女朋友'}]
newArr2[0] = '十年生死两茫茫，不思量，自难忘'
console.log(newArr2) // [{s: '当时明月在，曾照彩云归', zhen: '十年生死两茫茫，不思量，自难忘'}]
console.log(arr)     // [{s: '当时明月在，曾照彩云归', zhen: '两个黄鹂鸣翠柳，我还没有女朋友'}]

• 利用JSON的方法

let newArr3 = JSON.parse(JSON.stringify(arr))
console.log(newArr3)  // [{s: '当时明月在，曾照彩云归', zhen: '两个黄鹂鸣翠柳，我还没有女朋友'}]
newArr3[0] = '十年生死两茫茫，不思量，自难忘'
console.log(newArr3)  // [{s: '当时明月在，曾照彩云归', zhen: '十年生死两茫茫，不思量，自难忘'}]
console.log(arr)      // [{s: '当时明月在，曾照彩云归', zhen: '两个黄鹂鸣翠柳，我还没有女朋友'}]

转载于:https://www.cnblogs.com/sinosaurus/p/8869698.html