当前位置:网站首页 > Vue.js开发 > 正文

js浅拷贝和深拷贝原理(js浅拷贝和深拷贝原理一样吗)



JavaScript 中的浅拷贝和深拷贝指的是在复制对象(包括对象、数组等)时,是否只复制对象的引用地址或者在复制时创建一个新的对象。具体区别如下:

浅拷贝:浅拷贝只拷贝基本类型的数据,而符合类型的数据只复制指向其的指针,而不复制对象本身,新旧对象还是共享同一块内存。这意味着如果原始对象的属性或子对象发生更改,则复制的对象也会受到影响。常见的实现方式包括使用 Object.assign()方法、展开运算符(…)以及循环遍历对象并将其属性复制到新对象中。

深拷贝:深拷贝会另外创造一个一模一样的对象,新对象跟原对象不共享内存,修改新对象不会改到原对象。

当我们进行 JavaScript 对象或数组的浅拷贝时,它只会复制其基本值的引用,而不是完全复制内容。也就是说,浅拷贝只是复制了原始对象的属性/元素的引用,并没有新建一个对象。

例如,如果我们有一个简单的对象:

然后我们使用对象的赋值语法来创建一个浅拷贝:

此时, 和 都指向同一个内存地址。如果我们改变 的某个属性,那么 的相应属性也会发生改变。

这是因为 和 指向的是同一个内存地址,所以任何更改都会反映在另一个变量上。

类似地,在数组中进行浅拷贝也会产生相同的效果:

浅拷贝可以使用 Object.assign() 或者展开运算符 … 来实现;

相比于浅拷贝,深拷贝会复制整个对象或数组,包括其所有的嵌套子对象和数组。这意味着新创建的对象与原始对象没有任何关联,改变其中一个对象不会影响另一个。

例如,如果我们使用 JavaScript 的内置函数 和 来进行深拷贝:

在这个例子中,先使用 将原始对象序列化为字符串,再使用 将其解析为新对象。由于字符串是基本类型的值,而非引用类型,因此 是一个全新的对象,与 没有关系。

类似地,在数组中进行深拷贝也会产生相同的效果:

在这个例子中,通过深拷贝创建了一个新数组,并且修改新数组中嵌套数组的元素时,原始数组并不会受到影响。

深拷贝可以使用 JSON.parse(JSON.stringify(obj))、递归复制对象属性、第三方库如 lodash 的 deepClone 等方式来实现。但需注意的是,这些方法也有可能存在一些限制和缺陷,比如不能处理函数、循环引用等问题

到此这篇关于JavaScript中的浅拷贝和深拷贝原理与实现浅析的文章就介绍到这了,更多相关Javascript深拷贝与浅拷贝内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

到此这篇js浅拷贝和深拷贝原理(js浅拷贝和深拷贝原理一样吗)的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!

版权声明


相关文章:

  • javajson字符串转map(javajson字符串转list)2026-01-27 17:36:05
  • redhat6.9 u盘安装(u盘安装redhat8)2026-01-27 17:36:05
  • pymysql下载安装(pymysql1.0.2)2026-01-27 17:36:05
  • ad如何设置中文(ad6.8设置中文)2026-01-27 17:36:05
  • ip1921681001登录入口(ip192.168.0.102登录入口)2026-01-27 17:36:05
  • auto_uninstaller密钥怎么弄(auto_uninstaller9.3.28密钥怎么弄)2026-01-27 17:36:05
  • pcie 4.0速度(pcie4.0x2速度)2026-01-27 17:36:05
  • 192.168.100.1随身wifi登录(192.168.100.1随身wifi登录密码忘记了)2026-01-27 17:36:05
  • vue父子组件传值props(vue父子组件传值的几种方法)2026-01-27 17:36:05
  • map转json字符串再转对象(map转为json字符串)2026-01-27 17:36:05
  • 全屏图片