深拷贝浅拷贝

发表于
字数统计 324 字 | 阅读时长 1 分钟

定义

JavaScript中，基本类型以及引用类型的值存储方式是不一样的，基本类型的值保存在栈中。而引用类型的值保存在堆中，并在栈中保存一个指向堆的地址。因而在复制中，直接用等号复制引用类型的值只能复制地址，如果修改复制的变量也会影响原变量。如果新开辟一块内存，把引用类型中所有属性复制过去，这种拷贝就是深拷贝，否则就是浅拷贝。

实现深拷贝

递归

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function deepCopy(obj) {
  var cloneobj = Array.isArray(obj)?[]:{};
  if(obj&&typeof obj ==='object'){
    for (var key in obj) {
      if (obj.hasOwnProperty(key)) {
        if(typeof obj[key]==='object'){
          cloneobj[key] = deepCopy(obj[key]);
        }else {
          cloneobj[key] = obj[key]
        }
      }
    }
  }
  return cloneobj;
}
a = [1,2,3,4,5];
b = deepCopy(a);//[1,2,3,4,5]
b[1] = 5;//[1,5,3,4,5]
a;//[1,2,3,4,5]

json方法

1
2
3
4
function deepCopy(obj) {
  var cloneobj = JSON.parse(JSON.Stringfy(obj))
  return cloneobj;
}

jquery extend

$.extend( [deep ], target, object1 [, objectN ] )
deep表示是否深拷贝，为true为深拷贝，为false，则为浅拷贝
target Object类型 目标对象，其他对象的成员属性将被附加到该对象上。

1
2
3
4
5
let a=[0,1,[2,3],4],
    b=$.extend(true,[],a);
a[0]=1;
a[2][0]=1;
console.log(a,b);