网站首页 > 技术文章 正文
JSON.stringify()进行深拷贝的各种坑
当对象中有时间类型的元素时候 -----时间类型会被变成字符串类型数据
const obj = {
date:new Date()
}
typeof obj.date === 'object' //true
const objCopy = JSON.parse(JSON.stringify(obj));
typeof objCopy.date === string; //true
然后你就会惊讶的发现,getTime()调不了了,getYearFull()也调不了了。就连所有时间类型的内置方法都调不动了。
但,string类型的内置方法全能调了。
当对象中有undefined类型或function类型的数据时 --- undefined和function会直接丢失
const obj = {
undef: undefined,
fun: () => { console.log('叽里呱啦,阿巴阿巴') }
}
console.log(obj,"obj");
const objCopy = JSON.parse(JSON.stringify(obj));
console.log(objCopy,"objCopy")
然后你就会发现,这两种类型的数据都没了。
当对象中有NaN、Infinity和-Infinity这三种值的时候 --- 会变成null
1.7976931348623157E+10308 是浮点数的最大上限 显示为Infinity
-1.7976931348623157E+10308 是浮点数的最小下线 显示为-Infinity
const obj = {
nan:NaN,
infinityMax:1.7976931348623157E+10308,
infinityMin:-1.7976931348623157E+10308,
}
console.log(obj, "obj");
const objCopy = JSON.parse(JSON.stringify(obj));
console.log(objCopy,"objCopy")
当对象循环引用的时候 --会报错
const obj = {
objChild:null
}
obj.objChild = obj;
const objCopy = JSON.parse(JSON.stringify(obj));
console.log(objCopy,"objCopy")
假如你有幸需要拷贝这么一个对象 ↓
const obj = {
nan:NaN,
infinityMax:1.7976931348623157E+10308,
infinityMin:-1.7976931348623157E+10308,
undef: undefined,
fun: () => { console.log('叽里呱啦,阿巴阿巴') },
date:new Date,
}
然后你就会发现,好家伙,没一个是正常的。
你还在使用JSON.stringify()来实现深拷贝吗?
如果还在使用的话,小心了。作者推荐以后深拷贝使用递归的方式进行深拷贝。
这篇javascript高级篇之实现深拷贝的四种方式文章里面有封装好的可以进行深拷贝的递归函数,友友们可以自取。
猜你喜欢
- 2025-06-23 Java中玩转JSON:让数据交互变得简单又有趣
- 2025-06-23 爬虫逆向学习-下载网易云音乐(爬虫逆向分析)
- 2025-06-23 一篇长文带你在Python里玩转Json数据
- 2025-06-23 为何推荐 JsonTree.js 做 JSON 可视化?
- 2025-06-23 能运行,不代表它是对的:5 个潜伏在正常功能下的 JavaScript 错误
- 2025-06-23 让Android开发者轻松解析json数据的三种工具
- 2025-06-23 必知必会!Python json模块全解析(python json encode)
- 2025-06-23 JavaScript的Symbol,解决了多少你不知道的隐形大麻烦?
- 2025-06-23 JSON 对象的这些操作和使用场景你知道多少?
- 2025-06-23 JSON 对象的克隆:浅拷贝与深拷贝(jsonobject深拷贝)
- 09-04综艺做成这样都上不了热搜?_综艺节目热播原因
- 09-04webRTC中音频相关的netEQ(二):数据结构
- 09-04每日一词“era”_每日一页歌词
- 09-04css 布局简述_简述css布局技术的特点
- 09-049个专业级别的CSS技巧区分了解和精通的鸿沟
- 09-04BeautifulSoup如何将含有data-tag标签的元素提取出来?
- 09-04CSS 中实现动画效果的方法_css动画制作
- 09-045个CSS新功能,简单好用还超省时间
- 最近发表
- 标签列表
-
- cmd/c (90)
- c++中::是什么意思 (84)
- 标签用于 (71)
- 主键只能有一个吗 (77)
- c#console.writeline不显示 (95)
- pythoncase语句 (88)
- es6includes (74)
- sqlset (76)
- windowsscripthost (69)
- apt-getinstall-y (100)
- node_modules怎么生成 (87)
- chromepost (71)
- flexdirection (73)
- c++int转char (80)
- mysqlany_value (79)
- static函数和普通函数 (84)
- el-date-picker开始日期早于结束日期 (76)
- asynccallback (71)
- localstorage.removeitem (74)
- vector线程安全吗 (70)
- java (73)
- js数组插入 (83)
- mac安装java (72)
- 查看mysql是否启动 (70)
- 无效的列索引 (74)