深拷贝浅拷贝的问题

Question

我操作清空Data2的coilCode，Data1的数据也会变，它们是不是指向了同一内存地址，怎么解决，深拷贝吗，请问怎么用

   function(list) {
      this.Data1 = list
      this.Data2 = list
      this.Data2.forEach(i => {
        i.name = ''
      })

Answer 1

可以用扩展语法...拷贝一份出来

this.tableData1 = list
this.tableData2 = list.map(item => ({ ...item, coilCode: '' }))

Answer 2

深拷贝不是件容易的事，会遇到循环引用之类的难题。

有一个奇技淫巧是使用JSON.parse(JSON.stringify(obj))进行深拷贝，但是遇到一些特殊类型会失效，例如：

• 值为undefined的字段无法拷贝
• 正则表达式字段无法拷贝
• Date类型字段最后会变成字符串，而不是Date类型

也可以使用现有开源库，例如：

• 使用jQuery.extend()实现深拷贝
• 使用lodash库的_.cloneDeep(obj)实现深拷贝

Answer 3

用转换成json再转换回对象的方式，封装成函数以后可以直接用。

copyDeep(templateData) {
    // templateData 是要复制的数组或对象，这样的数组或者对象就是指向新的地址的
    return JSON.parse(JSON.stringify(templateData));
}

Answer 4

@chend 二楼的回答其实已经非常实用了。JSON.parse(JSON.stringify(obj))转换大法的弊端也诚如其所言，所以对于数组，我的一般深拷贝思路是

this.Data2 = [].concat(list)

相对优雅些，也没有其上所言的弊端

Answer 5

用JSON.parse(JSON.stringify(obj))貌似性能差点，下面这个方法也可以深克隆

export function clone(obj, obj2) {
  obj2 = obj2 || {};
  for (let name in obj) {
    if (obj[name] instanceof Object) {
      //先判断一下obj[name]是不是一个对象
      obj2[name] = obj[name] instanceof Array ? [] : {}; //我们让要复制的对象的name项=数组或者是json
      clone(obj[name], obj2[name]); //然后来无限调用函数自己 递归思想
    } else {
      obj2[name] = obj[name]; //如果不是对象，直接等于即可，不会发生引用。
    }
  }
  return obj2; //然后在把复制好的对象给return出去
}