对象,数组深拷贝方法

对于基本类型的数据我们直接重新定义变量就可以,但是对于引用类型的数据如果我们需要保持原有的数据不被更改,我们需要一些特殊的处理,让他们指向不同的地址.

如果是简单的纯属组类型比如数组中是数字,字符串类型,可直接通过slice,concat实现深拷贝.

如果是对象的话处理会比较麻烦,我们平时经常用的方法比如通过new Object(),Object.assign(),es6的扩展运算符等其实都是浅拷贝,他们还是指向的一个地址,改变对象中的引用类型的值,另一个也会改变.

通过JSON.stringify()实现深拷贝

var obj1 = {
    name: "jock",
    age: 20,
    arr: [1,2,3]
}
var obj2 = JSON.stringify(obj1);
obj2 = JSON.parse(obj2);
obj2.name = "tom";
obj2.arr[1] = "dfy"
console.log(obj1,obj2);

1.png

发现这种方式是可以的,但是这种方法有个弊端,就是对象中不能有方法和正则表达式.所以如果需要一个公共的方法我们需要自己通过递归实现深拷贝.

递归实现深拷贝

function deep(obj1,obj2){
    for(var key in obj2){
      if(typeof obj2[key] == "object"){
        obj1[key] = obj2[key].constructor == Array ? [] : {}
        deep(obj1[key], obj2[key])
      }else{
        obj1[key] = obj2[key]
      }
  }
  return obj1;
}

我们来测试一下上面的方法

var obj3 = {
    name: "lilei", 
    age: 20,
    fuc: function(){
        console.log(10)
    },
    arr: [1,2,3,4,5,6]
}
var obj4 = deep({},obj3);
obj4.age = 100;
obj4.arr[0] = 100;
console.log(obj3,obj4)

2.png