js深拷贝与浅拷贝的区别及实现

时间：2021-06-16 19:50:53

参考：

https://blog.csdn.net/flyingpig2016/article/details/52895620

https://www.cnblogs.com/chengguanhui/p/4737413.html

https://www.zhihu.com/question/23031215

 

　　要了解其本质区别，就需要了解堆和栈，值与引用的概念及区别

1.堆（stack）和栈（heap）

stack为自动分配的内存空间，它由系统自动释放；而heap则是动态分配的内存，大小不定也不会自动释放。

2.值与引用

js中有基本数据类型和引用类型；

基本数据类型的变量和值都是存放在栈中，声明之后会分配一块内存区域，基本数据类型之间的赋值是直接把栈内存中存的值赋值给变量（传值）

引用类型的变量存在栈中，但值是存在堆中，实际上栈存放的是指向堆中的地址，也叫引用，引用类型直接的赋值实质是把引用赋值给一个变量（传址），所以其指向的堆内存中的值是一样的

 3.深拷贝和浅拷贝

深拷贝和浅拷贝的使用场景是在复杂对象里，即对象的属性还是对象，

浅拷贝是指只复制一层对象，当对象的属性是引用类型时，实质复制的是其引用，当引用指向的值改变时也会跟着变化

例如：

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

深拷贝是指复制对象的所有层级，实现方法

（1）通过递归实现

deepCopy(o) {
    if (o instanceof Array) {
      let n = [];
      for (let i = 0; i < o.length; ++i) {
        n[i] =deepCopy(o[i]);
      }
      return n;
    } else if (o instanceof Object) {
      let n = {}
      for (let i in o) {
        n[i] = deepCopy(o[i]);
      }
      return n;
    } else {
      return o;
    }
  }

（2）通过JSON解析实现

//把一个对象转成json字符串在转成json对象
JSON.parse(JSON.stringify(o))

 

标签：

相关文章