对象中有时间类型的时候(时间类型会被变成字符串类型数据)

const obj = {
date: new Date()
}
console.log(typeof obj.date === 'object') //true
const objCopy = JSON.parse(JSON.stringify(obj));
console.log(obj.date.getTime()) //正常使用 console.log(typeof objCopy.date) //输出的值字符串 string
console.log(objCopy.date.getTime()) // 报错 objCopy.date.getTime is not a function 我们就会惊讶的发现,
getTime ()调不了了???(是不是有点奇怪)
getYearFull()也调不了了。
就所有时间类型的内置方法都调不动了。
但,string类型的内置方法全能调了。

对象中有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()来实现深拷贝吗?
如果你拷贝的对象中有 new Date,undefined,函数,NaN,infinityMax, infinityMin。
这6种的时候,你就要小心了,就会出现问题
如果还在使用的话,小心了。
文章来自链接:https://juejin.cn/post/7113829141392130078

使用JSON.stringify()去实现深拷贝,要小心哦,可能有巨坑的更多相关文章

  1. 用JSON.stringify去实现深拷贝的弊端

    无法处理function啦还有RegExp啦,还有无法处理循环引用对象(这个我还没有test) 就前两点的话 var a={ a:, b:new RegExp('test'), c:function( ...

  2. 关于JSON.parse(JSON.stringify(obj))实现深拷贝应该注意的坑

    JSON.parse(JSON.stringify(obj))我们一般用来深拷贝,其过程说白了 就是利用JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse来反 ...

  3. JSON.parse(JSON.stringify()) 实现对对象的深拷贝

    JSON.parse(JSON.stringify(obj))我们一般用来深拷贝,其过程说白了 就是利用JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse来反 ...

  4. JSON.stringify方法报错:Converting circular structure to JSON

    别以为JSON.parse(JSON.stringify(data))做深拷贝无敌,对于以下这种情况,当你需要保留父级对象,即 对象存在循环引用,就会报错. var a = [ { "id& ...

  5. 使用JSON.parse(),JSON.stringify()实现对对象的深拷贝

    根据不包含引用对象的普通数组深拷贝得到启发,不拷贝引用对象,拷贝一个字符串会新辟一个新的存储地址,这样就切断了引用对象的指针联系. 测试例子: var test={ a:"ss", ...

  6. 实现深拷贝还在用JSON.parse(JSON.stringify(obj))?带你用JS实现一个完整版深拷贝函数

    使用JavaScript实现深拷贝 1.JSON序列化实现深拷贝 在JS中,想要对某一个对象(引用类型)进行一次简单的深拷贝,可以使用JSON提供给我们的两个方法. JSON.stringfy():可 ...

  7. JSON.stringify() 的深入理解

    目录 序言 语法 深入理解 序言 最近在看<你所不知道的javascript>[中卷]一书,第一部分是类型和语法.本文是基于这部分的产物.在强制类型转换->抽象值操作-> to ...

  8. JSON.stringify()还可以这么用

    最近做项目的时候遇到一个对象深拷贝的问题,网上看了下发现最为简便的方法是JSON.stringify(),比如你要深拷贝一个对象,可以这么做: var test={ a:"hello&quo ...

  9. JSON.parse和JSON.stringify 参数详解

    JSON.parse和JSON.stringify这两个浏览器自带(IE6/7除外)的方法平常我们经常用到,但是一般都只是用到了他们的第一个参数,比如字符串转对象:JSON.parse('{}')   ...

  10. 用json方法来作深拷贝应该知道的一点东西!

    之前写js比较多的的时候也写过深拷贝,浅拷贝,继承啥的,还有自定义的监听事件.然而过了很久都忘了. 最近在项目上用的深拷贝都是 b = JSON.parse( JSON.stringify(a) ) ...

随机推荐

  1. 华为云媒体査勇:华为云在视频AI转码领域的技术实践

    摘要:为大家介绍华为云媒体处理服务在视频AI转码领域的一些技术实践. 随着5G的落地和消费终端的不断升级,消费环节对视频画质的要求也越来越高,为了给消费者带来更清晰.更逼真和更具沉浸感的观感体验,对云 ...

  2. 华为云企业级Redis:助力VMALL打造先进特征平台

    摘要:当电商平台对AI算法模型的需求越来越多,特征数据平台的统一建设是不少开发团队头疼的事情.因为只有通过统一的特征数据存储,才能改变原有的"数据孤岛",解决生产重复造轮子的窘境. ...

  3. chrome对页面重绘和回流以及优化进行优化

    页面的绘制时间(paint time)是每一个前端开发都需要关注的的重要指标,它决定了你的页面流畅程度.而如何去观察页面的绘制时间,找到性能瓶颈,可以借助Chrome的开发者工具. 回流与重绘 1. ...

  4. 开心档之MySQL 导出数据

    MySQL 导出数据 MySQL中你可以使用SELECT...INTO OUTFILE语句来简单的导出数据到文本文件上. 使用 SELECT ... INTO OUTFILE 语句导出数据 以下实例中 ...

  5. npm 新型定时攻击或导致软件供应链安全风险

    原标题: New npm timing attack could lead to supply chain attacks 原文链接: https://www.bleepingcomputer.com ...

  6. 超详细的 Jenkins 安全tips

    Jenkins 作为一个开放的.可定制的平台,即使在默认状态下也提供了不错的安全性.但是鉴于 Jenkins 连接了许多行业工具,因此也存在一定安全隐患.本篇文章将会介绍一些方法和工具,来确保 Jen ...

  7. 既快又稳还方便,火山引擎 VeDI 的这款产品解了分析师的愁

    更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 "数据加载速度变快了."这是小吴在使用 DataWind 后的第一感受. 目前就职于国内一家手 ...

  8. DamiBus v0.51 发布

    DamiBus,专为本地多模块之间通讯解耦而设计(尤其是未知模块.隔离模块.领域模块).零依赖,特适合 DDD. 特点 结合 Bus 与 RPC 的概念,可作事件分发,可作接口调用,可作响应订阅. 支 ...

  9. Mac Parallels (PD) 常规设置

    Mac 上安装了 Parallels (PD) 程序默认使用 Parallels 打开,比较烦人,取消设置: 虚机中不显示 mac 的菜单栏 ,按 Control + Option 就会临时显示 备份 ...

  10. django DRF

    博客目录 web应用模式 api接口 接口测试工具postman restful规范 drf安装 序列化和反序列化 CBV源码分析 drf之APIView分析 drf之Request对象分析 drf- ...