美文网首页
JavaScript对象的深浅拷贝

JavaScript对象的深浅拷贝

作者: 小明的明 | 来源:发表于2018-10-24 18:44 被阅读11次

在项目中我们会经常遇到这样的问题,当我把一个对象赋值给另一个新的对象的时候,当我改变其中一个,另一个数据也跟着改变,但是我的需求是只想让新的对象改变,之前的对象不改变,那么问题来了,我该怎么实现呢?

上边的问题,我想大家会经常遇见,这就是深浅拷贝的问题了,那么我们现在来探讨一下什么叫深浅拷贝,如何实现深浅拷贝

,对象的深拷贝会拷贝对象中层层嵌套的对象的属性。

浅复制:

浅拷贝是指只拷贝一层对象的属性,不会拷贝对象中的对象的属性。下面是一个简单的浅拷贝实现。

这种方法不能实现数组的浅拷贝,而且丢失了对象的constructor属性,这样的话我们就针对的讲construtor也复制过来

那么我们现在来尝试一下

结果如下:

可以正确实现数组复制和并且保留constructor了,但细心的你一定发现了,浅复制后的对象的 arr2Copy[3] 和 arr2[3] 指向的是一个对象,改变其中一个,同时也会改变另一个。我们想要实现的是复制,但这并不是复制呀!

这是浅复制的一个弊端所在,接下让我们看看深复制是怎样解决这个问题的。

深复制:

深复制需要层层递归,复制对象的所有属性,包括对象属性的属性的属性

如果只是需要简单地复制对象的属性,而不用考虑它的constructor,也不用考虑函数,正则,Data等特殊数据类型,那这里有一个深复制的小trick,两行代码即可:

大多数情况下,上面的就可以满足要求了,但一些时候,我们需要把函数,正则等特殊数据类型也考虑在内,或者当前环境不支持JSON时,上面的方法也就不适用了。这时,我们可以通过递归来实现对象的深层复制,如下:

这样就可以完美实现大多数对象的拷贝
面向对象的编程语言,其核心是对象,因此深入了解对象的相关操作,纵向比较异同,对学习过程是极有好处的。

相关文章

  • JavaScript 对象深浅拷贝

    浅拷贝: 深拷贝:

  • JavaScript对象深浅拷贝

    首先对象属性和方法的简写方法。 Object.assign()Object.assign方法用于对象的合并。当对象...

  • Javascript对象的深浅拷贝

    开门见山,有人叫对象的复制为深复制浅复制,也有人叫深拷贝浅拷贝。其实都是copy。 深拷贝(递归复制,复制所有层级...

  • JavaScript对象的深浅拷贝

    在项目中我们会经常遇到这样的问题,当我把一个对象赋值给另一个新的对象的时候,当我改变其中一个,另一个数据也跟着改变...

  • JavaScript篇——对象的深浅拷贝

    我们知道,在JavaScript中复制一个基本类型的值很容易实现,但如果要复制的值是一个引用类型(如Object类...

  • javascript深浅拷贝

    Javascript有六种基本数据类型(也就是简单数据类型),它们分别是:Undefined,Null,Boole...

  • javascript深浅拷贝

    underscore 的源码中,有很多地方用到了 Array.prototype.slice() 方法,但是并没有...

  • JavaScript深浅拷贝

    简单讲呢,深浅拷贝,都是进行复制,那么区别主要在于复制出来的新对象和原来的对象是否会互相影响,改一个,另一个也会变...

  • Javascript深浅拷贝

    浅拷贝 1.基本数据类型 是存在栈中的,所以=赋值,都会创建一个新的空间,例如 变量b有自己独立的空间 2.对象数...

  • JavaScript深浅拷贝

    原文链接 http://blog.poetries.top/2018/12/21/js-deep-copy/ 关注...

网友评论

      本文标题:JavaScript对象的深浅拷贝

      本文链接:https://www.haomeiwen.com/subject/cnvxtqtx.html