JavaScript深拷贝与浅拷贝的几种方式_javascript技巧

浅拷贝只复制对象第一层属性，深层仍共享引用；深拷贝递归复制所有层级，完全断开引用。常用浅拷贝方法有Object.assign()、扩展运算符、slice()/concat()；深拷贝可使用JSON.parse(JSON.stringify())（有限制）、递归实现、structuredClone()或Lodash的cloneDeep()。示例表明浅拷贝修改嵌套属性会影响原对象，而深拷贝不会。手动实现深拷贝需处理对象、数组、基本类型及特殊类型，但简单递归未解决循环引用，生产环境推荐成熟库。选择方式应根据数据类型、性能需求和兼容性综合考虑。

JavaScript中的深拷贝和浅拷贝主要针对引用类型（如对象、数组）在赋值时的行为差异。浅拷贝只复制对象的第一层属性，深层嵌套仍共享同一引用；而深拷贝会递归复制所有层级，完全断开引用关系。下面介绍几种常见的实现方式。

浅拷贝的常用方法

浅拷贝适用于只需复制第一层属性的场景，修改嵌套属性时仍会影响原对象。

• Object.assign()：将源对象的所有可枚举属性复制到目标对象。注意仅复制一层。
• 扩展运算符 {...} ：语法简洁，常用于对象或数组的浅复制。
• Array.prototype.slice() / concat()：适用于数组，生成新数组但不深拷贝内部元素。

示例：

深拷贝的基本方法

深拷贝能彻底隔离新旧对象，适合复杂嵌套结构。

立即学习“Java免费学习笔记（深入）”；

• JSON.parse(JSON.stringify())：最简单的方法，但有局限性，无法处理函数、undefined、Symbol、循环引用等。
• 递归实现深拷贝：手动遍历对象属性，对引用类型递归调用拷贝函数，可控性强。
• 使用结构化克隆算法（Structured Clone）：部分浏览器支持，如 structuredClone()，支持多数数据类型。
• 第三方库（如 Lodash）：提供成熟的 _.cloneDeep() 方法，兼容性好。

示例：JSON方式

标贝科技

标贝科技-专业AI语音服务的人工智能开放平台

14

查看详情

手动实现一个简易深拷贝函数

通过类型判断和递归，可以处理大多数情况。

这个版本能处理对象、数组、基本类型和嵌套结构，但未解决循环引用问题。生产环境建议使用成熟库。

注意事项与适用场景

选择拷贝方式需结合实际需求。

• 若对象不含函数、日期、Symbol 等特殊类型，JSON方法最快捷。
• 需要完整支持各种类型时，推荐使用 Lodash 的 cloneDeep。
• 频繁操作且性能敏感，可考虑优化的递归实现或 structuredClone（现代浏览器）。
• 注意循环引用会导致递归爆栈或JSON报错，需额外检测。

基本上就这些，理解原理后可根据项目需求灵活选择。

以上就是JavaScript深拷贝与浅拷贝的几种方式_javascript技巧的详细内容，更多请关注php中文网其它相关文章！