共计 1210 个字符,预计需要花费 4 分钟才能阅读完成。
咱们晓得做深拷贝的时候能够应用递归的形式也能够用 JSON.stringify + JSON.parse
这种看起来简略的形式。
那么 JSON.stringify + JSON.parse
这种形式真的好用吗?
我的教训通知我:JSON.stringify + JSON.parse
做深拷贝不平安,而且在大数据量的状况下存在性能问题 , 不举荐应用。
上面咱们次要围绕不平安的问题进行探讨,对于性能的问题简略提下。
为何不平安
不平安次要体现在两个方面:
- 拷贝过程中数据失真、失落
- 解决非凡数据时候报错
数据失真、失落
数据失真,失落次要在这几种类型中有体现
Date 对象拷贝后数据类型变成字符串
let obj = {d: new Date(),
};
console.log(JSON.parse(JSON.stringify(obj)));
// {d: "2020-08-12T04:47:40.958Z"}
正则对象、Error 对象拷贝后变成空对象
let obj = {
r: /\d+/gi,
e: new Error('an error')
};
console.log(JSON.parse(JSON.stringify(obj)));
// {r: {}, e: {}}
对象外面的函数和 undefined 属性拷贝后属性失落
let obj = {
f: console.log,
u: undefined
};
console.log(JSON.parse(JSON.stringify(obj)));
// {}
NaN、Infinity、-Infinity 拷贝后变为 null
let obj = {
i: Infinity,
l: -Infinity,
n: NaN,
};
console.log(JSON.parse(JSON.stringify(obj)));
// {i: null, l: null, n: null}
扭转对象的原型链
如果,对象的某个属性是由构造函数生成的,那么在拷贝后,他的 constructor
会指向Object
。
var A = function () {this.a = 'a';};
var a = new A();
var b = JSON.parse(JSON.stringify(a));
console.log(a.constructor, b.constructor);
// ƒ () {this.a = 'a'} ƒ Object() { [native code] }
非凡数据报错
这个简略的说就是如果对象中有环的话话就会报错,最简略的例子就是
console.log(JSON.parse(JSON.stringify(window)));
这个就会报错,所以在应用这种形式做深拷贝的时候也要留神环的问题。
为何性能差
对于性能的问题我这里不多说,举荐《如何晋升 JSON.stringify()的性能》这篇文章,这篇文章对 JSON.stringify
的性能问题说的很清晰,我也很认同。
参考文档
- JSON.stringify 深拷贝的毛病
- 如何晋升 JSON.stringify()的性能
正文完