关于javascript的深拷贝浅拷贝思考

深拷贝，浅拷贝

什么是复制？
- 简单变量的复制，内存小，我们直接复制不会发生引用。
- 首先深复制和浅复制只针对像 Object, Array 这样的复杂对象的。简单来说，浅复制只复制一层对象的属性，而深复制则递归复制了所有层级。

下面是一个简单的浅复制

浅复制只会将对象的属性依次复制，而不会进行递归，而 javascript 储存对象都是村地址的，浅复制就是将 obj.arr 和 shallowObj.arr 指向同一个内存地址

var obj = { a:1, arr: [2,3] };
var shallowObj = shallowCopy(obj);

function shallowCopy(src) {
  var dst = {};
  for (var prop in src) {
    if (src.hasOwnProperty(prop)) {
      dst[prop] = src[prop];
    }
  }
  return dst;
}

当我们测试的时候就会发现这样的结果

shallowObj.arr[1] = 5;
obj.arr[1]   // = 5

下面是一个深复制的例子
- 深复制的原理上面提到了，我们直接来看代码。
```
var obj = { a:1, arr: [1,2] };
var obj2 = deepCopy(obj);
```

下面来讨论普遍的深浅复制的几种实现方法

ES6 使用两种复制方法不会发生引用
- array2 = Array.form(array1)
- array2 = [...array1];

基本的 js 数组和 json 复制

array2 = array1.slice(0)
array2 = array1.concat()

//循环复制
for(var i = 0;i < arr1.length; i++){
    arr2[i] = arr1[i];
}

//json数据
for(var name in json1){
    json2[name] = json1[name];
}

浅复制的几种方法

var json1 = {"a":"panda","arr1":[1,2,3]}
function copy(obj1) {
    var obj2 = {};
&emsp;&emsp;for (var i in obj1) {
&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;obj2[i] = obj1[i];
&emsp;&emsp;}
    return obj2;
}
var json2 = copy(json1);
json1.arr1.push(4);
alert(json1.arr1);  //1234
alert(json2.arr1)  //1234

深复制的几种方法


//简单粗暴的深复制
//劣势:无法复制函数
//原型链没了，对象就是object，所属的类没了。
function jsonClone(obj) {
    return JSON.parse(JSON.stringify(obj));
}
var clone = jsonClone({ a:1 });
---------------
var json1={"name":"panda","age":18,"arr1":[1,2,3,4,5],"string":'afasfsafa',"arr2":[1,2,3,4,5],"arr3":[{"name1":"panda"},{"job":"前端开发"}]};
var json2={};

function copy(obj1,obj2){
  var obj2=obj2||{}; //最初的时候给它一个初始值=它自己或者是一个json
  for(var name in obj1){
    if(typeof obj1[name] === "object"){ //先判断一下obj[name]是不是一个对象
      obj2[name]= (obj1[name].constructor===Array)?[]:{}; //我们让要复制的对象的name项=数组或者是json
      copy(obj1[name],obj2[name]); //然后来无限调用函数自己 递归思想
    }else{
      obj2[name]=obj1[name];  //如果不是对象，直接等于即可，不会发生引用。
    }
  }
  return obj2; //然后在把复制好的对象给return出去
}
json2=copy(json1,json2)
json1.arr1.push(6);
alert(json1.arr1);  //123456
alert(json2.arr1);  //12345

参考了:

深入剖析 JavaScript 的深复制

js中对象的复制，浅复制（浅拷贝）和深复制（深拷贝）

你不知道的 javascript (上)

欢迎来我的主页和留言探讨问题

lpove.github.io/hexo/

关于javascript的深拷贝浅拷贝 思考

目录:

深拷贝，浅拷贝

欢迎来我的主页和留言探讨问题

关于javascript的深拷贝浅拷贝思考