JavaScript深拷贝的几种实现方式总结
本文总结了JavaScript中实现深拷贝的三种常见方法：Object.assign适用于简单单层对象，JSON.parse与JSON.stringify处理深层嵌套但会丢失函数和特殊类型，递归拷贝则通过判断对象类型处理特殊情况。文章提供了具体代码示例及结果分析，帮助开发者根据实际需求选择合适的拷贝方案。
在前端项目的数据处理中，JSON数据的拷贝是非常常见的操作。为了确保拷贝后的双方数据互不影响，通常需要采用深拷贝技术。
深拷贝的原理是：引用数据类型的名称存储在栈内存中，而实际值存储在堆内存中。栈内存中保存一个指向堆内存值的地址引用。深拷贝则是增加一个新的指针，并申请一块新的内存空间，使这个新指针指向这块新分配的内存，从而切断与原数据的引用关系。方法一：使用Object.assign()。该方法通常适用于数据类型较为简单、层级不超过1层的数据拷贝，因为Object.assign无法实现深层嵌套数据的完全拷贝。
const strJson = {
id:'12343231',
name:'张三',
age:23,
inof:{
sex:'男'
},
sjid:null,
strHandle () {
console.log('111111111');
}
}
obj.name = 'lisi'
obj.inof.sex = '女'
console.log('obj',obj);
console.log('strJson',strJson);
运行结果如下：
方法二：使用JSON.parse和JSON.stringify组合。这种方法通常适用于数据类型比较复杂、存在深层嵌套结构的数据。需要注意的是，该方法无法处理undefined、function、RegExp等类型的数据。
const strJson = {
id:'12343231',
name:'张三',
age:23,
inof:{
sex:'男'
},
sjid:null,
strHandle () {
console.log('111111111');
}
}
const obj = JSON.parse(JSON.stringify(strJson))
obj.name = 'lisi'
obj.inof.sex = '女'
console.log('obj',obj);
console.log('strJson',strJson);
运行结果如下：
第三种方法：使用递归拷贝。在代码中手动处理各种特殊类型和情况。
function copyHandle (strJson) {
let result ;
// 判断是否存在
if (!strJson) return null;
// 判断是否是对象
if (typeof strJson !== 'object') return strJson;
// 判断是否是数组
if (Array.isArray(strJson)) {
result = [];
for (let i of strJson) {
result.push(copyHandle(i))
}
}//判断是否是RegExp
else if(strJson.constructor===RegExp) {
result = strJson
}//判断是否是对象
else {
result = {}
for (let i in strJson) {
result[i] = copyHandle(strJson[i])
}
}
// 返回结果
return result
}
总结
本文到此结束，希望能为读者提供有益的帮助。同时也欢迎大家关注本站，获取更多技术内容！
JS split切割后出现空字符串怎么过滤
2026-11-05 16:00:30
在 React 或 Vue 项目中封装使用 JS 节流防抖
2026-11-05 15:27:29
JavaScript中怎么将带小数的字符串转为整数？
2026-11-05 14:32:38
怎么用JavaScript策略模式重构电商促销计算逻辑？
2026-11-05 14:01:09
JS使用constructor判断数据类型可靠吗
2026-11-05 13:49:41