JS 采用JSON.parse实现深拷贝时出现的问题?

使用 JSON.parse(JSON.stringify()) 实现深拷贝是一种简单易用的方法,但也存在以下缺点:

1. 无法处理函数和 undefined

JSON.stringify() 方法无法处理 JavaScript 中的函数和 undefined 值,这些值会被忽略掉,因此在使用该方法时需要注意。

javascript 复制代码
let obj = {
  name: 'wyc',
  age: undefined,
  foo: function() {
    console.log('我是foo');
  },
}
let obj2 = JSON.parse(JSON.stringify(obj))
console.log(obj);
console.log(obj2);

2. 无法处理循环引用

如果原始对象中存在循环引用,即对象的某个属性引用了该对象本身,使用该方法就会抛出 TypeError 异常。

javascript 复制代码
const obj = {
  a: 1,
  b: {
    c: 2
  }
};
obj.d = obj;
 
// 报错:TypeError: Converting circular structure to JSO
console.log(JSON.parse(JSON.stringify(obj)));

3. 无法处理一些特殊对象

JSON.stringify() 方法无法处理某些特殊的 JavaScript 对象,如 RegExp、Error、Date 等,这些对象会被转换成空对象。

javascript 复制代码
const obj = {
  a: /abc/,
  b: new Error('error'),
  c: new Date()
};
 
const newObj = JSON.parse(JSON.stringify(obj));
console.log(newObj); // { a: {}, b: {}, c: '2022-02-22T12:34:56.000Z' }

4. 对象的原型链上的属性会丢失

如果原始对象的某个属性是通过原型链继承的,那么使用该方法得到的新对象会丢失该属性。

javascript 复制代码
function Person(name) {
  this.name = name;
}
 
Person.prototype.sayHi = function() {
  console.log(`Hi, I'm ${this.name}`);
};
 
const obj = new Person('Tom');
const newObj = JSON.parse(JSON.stringify(obj));
 
newObj.sayHi(); // 报错:Uncaught TypeError: newObj.sayHi is not a function

综上,虽然 JSON.parse(JSON.stringify()) 方法是一种简单易用的实现深拷贝的方法,但它并不完美,使用时需要注意其缺陷。对于需要处理函数、循环引用等复杂情况的对象,可以使用其他方法来实现深拷贝。

相关推荐
IT_陈寒几秒前
为什么Java的Stream并行处理反而变慢了?
前端·人工智能·后端
NiceCloud喜云29 分钟前
IntelliJ IDEA 保姆级安装 + ClaudeAPI 配置教程
java·开发语言·前端·ide·chrome·docker·intellij-idea
zithern_juejin40 分钟前
Date/RegExp/Error/ArrayBuffer
javascript
zenRRan1 小时前
Karpathy公开附议:AI Agent 的输出格式,正在从 Markdown 走向 HTML
前端·html
燐妤1 小时前
前端HTML编程5:JavaScript完全指南
前端·javascript·html
八月欢喜1 小时前
【Facebook】 实时消息监控难点解析
javascript·python·facebook
3D探路人1 小时前
模灵 大模型聚合API 转发流程技术实现
java·大数据·开发语言·前端·人工智能·计算机视觉
烛阴1 小时前
Unity资源加载进化论:从AssetBundle到Addressables,一文带你吃透手游资源管理
前端·c#·unity3d
TO_WebNow2 小时前
使用thinkPHP8.x 访问接口提示跨域
前端·php
掘金一周2 小时前
回家的时候用车,不回家感觉又没啥用,这车还要不要买 | 沸点周刊 5.14
前端