深浅拷贝

9 阅读2分钟

一,深浅拷贝

:深浅拷贝只针对引用类型。 开发中我们经常需要复制一个对象,如果直接用赋值会有下面问题:

image.png

image.png

1,浅拷贝

浅拷贝是拷贝地址,当拷贝了一个对象后修改里面的值时,原来的对象也会被修改,如下:

image.png image.png

为了解决这个问题,可以如下:

1.拷贝对象:Object.assgin() /展开运算符{..obj}拷贝对象

2.拷贝数组:Array.prototype.concat()或者[...arr]

方法一:

image.png image.png

方法二:

image.png image.png

但遇到对象里还有对象就失效了,因为在浅拷贝中,外层的对象可以拷贝到值,但对于里层的对象,就会拷贝地址,所以在修改里层的对象时,会一并修改,例子如下:

image.png

image.png

2,深拷贝

为了解决上面浅拷贝中对象嵌套时还是会拷贝到地址的问题,就出现了深拷贝,拷贝的就不再是地址,而是值。

方法一:通过递归实现深拷贝

函数递归:

  • 如果一个函数在内部可以调用其本身,那么这个函数就是递归函数
  • 简单理解:函数内部自己调用自己,这个函数就是递归函数
  • 递归函数的作用和循环效果类似
  • 由于递归很容易发生“栈溢出”错误(stack overflow),所以必须要加退出条件return

举例如下:

image.png

实现深拷贝例子:

image.png

image.png

只要对象里面嵌套多少层,就写多少个判断来进行处理,这样才能完全实现深拷贝而没有拷贝地址,如下:

image.png

image.png

image.png

方法二:JS工具库lodash中的cloneDeep实现深拷贝

lodash 网址:www.lodashjs.com/docs/lodash…

需要记得先引用lodash库。

image.png

方法三:通过JSON.stringify()实现

把对象转换为JSON字符串,再将字符串转换为对象即可。

image.png