浅拷贝只复制对象第一层属性，深层仍共享引用；深拷贝递归复制所有层级，完全断开引用。常用浅拷贝方法有Object.assign()、扩展运算符、slice()/concat()；深拷贝可使用JSON.parse(JSON.stringify())（有限制）、递归实现、structuredClone()或Lodash的cloneDeep()。示例表明浅拷贝修改嵌套属性会影响原对象，而深拷贝不会。手动实现深拷贝需处理对象、数组、基本类型及特殊类型，但简单递归未解决循环引用，生产环境推荐成熟库。选择方式应根据数据类型、性能需求和兼容性综合考虑。
JavaScript中的深拷贝和浅拷贝主要针对引用类型（如对象、数组）在赋值时的行为差异。浅拷贝只复制对象的第一层属性，深层嵌套仍共享同一引用；而深拷贝会递归复制所有层级，完全断开引用关系。下面介绍几种常见的实现方式。
浅拷贝的常用方法
浅拷贝适用于只需复制第一层属性的场景，修改嵌套属性时仍会影响原对象。
Object.assign()：将源对象的所有可枚举属性复制到目标对象。注意仅复制一层。 扩展运算符 {…} ：语法简洁，常用于对象或数组的浅复制。 Array.prototype.slice() / concat()：适用于数组，生成新数组但不深拷贝内部元素。
示例：
// 对象浅拷贝
const obj1 = { a: 1, b: { c: 2 } };
const obj2 = Object.assign({}, obj1);
obj2.b.c = 3;
console.log(obj1.b.c); // 输出 3，说明是浅拷贝
深拷贝的基本方法
深拷贝能彻底隔离新旧对象，适合复杂嵌套结构。
立即学习“Java免费学习笔记（深入）”；
JSON.parse(JSON.stringify())：最简单的方法，但有局限性，无法处理函数、undefined、Symbol、循环引用等。 递归实现深拷贝：手动遍历对象属性，对引用类型递归调用拷贝函数，可控性强。 使用结构化克隆算法（Structured Clone）：部分浏览器支持，如 structuredClone()，支持多数数据类型。 第三方库（如 Lodash）：提供成熟的 _.cloneDeep() 方法，兼容性好。
示例：JSON方式
const obj1 = { a: 1, b: { c: 2 } };
const obj2 = JSON.parse(JSON.stringify(obj1));
obj2.b.c = 3;
console.log(obj1.b.c); // 输出 2，成功深拷贝
手动实现一个简易深拷贝函数
通过类型判断和递归，可以处理大多数情况。
function deepClone(obj) {
if (obj === null || typeof obj !== ‘object’) return obj;
if (obj instanceof Date) return new Date(obj);
if (obj instanceof Array) return obj.map(item => deepClone(item));
if (typeof obj === ‘object’) {
const cloned = {};
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
cloned[key] = deepClone(obj[key]);
}
}
return cloned;
}
}
这个版本能处理对象、数组、基本类型和嵌套结构，但未解决循环引用问题。生产环境建议使用成熟库。
注意事项与适用场景
选择拷贝方式需结合实际需求。
若对象不含函数、日期、Symbol 等特殊类型，JSON方法最快捷。 需要完整支持各种类型时，推荐使用 Lodash 的 cloneDeep。 频繁操作且性能敏感，可考虑优化的递归实现或 structuredClone（现代浏览器）。 注意循环引用会导致递归爆栈或JSON报错，需额外检测。
基本上就这些，理解原理后可根据项目需求灵活选择。
以上就是JavaScript深拷贝与浅拷贝的几种方式_javascript技巧的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1536569.html
微信扫一扫 
支付宝扫一扫 
