深拷贝总结

JSON.parse(JSON.stringify(obj))

这行代码的运行过程,就是利用 JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse来反序列化(还原)js对象;序列化的作用是存储和传输。(对象本身存储的是一个地址映射,如果断电,对象将不存在,所以要将对象的内容转换成字符串的形式再保存在磁盘上)
不过,这种实现深拷贝的方法有局限性,它只适用于一般数据的拷贝(对象、数组),有以下情况需要注意:

1.如果json里面有时间对象,则序列化结果:时间对象=>字符串的形式;

{let obj = {age: 18,date: new Date()};let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj);console.log('objCopy', objCopy);console.log(typeof obj.date); // objectconsole.log(typeof objCopy.date); // string
}

image.png

2.如果json里有RegExp、Error对象,则序列化的结果将只得到空对象 RegExp、Error => {};

{let obj = {age: 18,reg: new RegExp('\w+'),err: new Error('error message')};let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj);console.log('objCopy', objCopy);
}

image.png

3.如果json里有 function,undefined,则序列化的结果会把 function,undefined 丢失;

{let obj = {age: 18,fn: function () {console.log('fn');},hh: undefined};let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj);console.log('objCopy', objCopy);
}

image.png

4.如果json里有NaN、Infinity和-Infinity,则序列化的结果会变成null;

{let obj = {age: 18,hh: NaN,isInfinite: 1.7976931348623157E+10308,minusInfinity: -1.7976931348623157E+10308};let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj);console.log('objCopy', objCopy);
}

image.png

5.如果json里有对象是由构造函数生成的,则序列化的结果会丢弃对象的 constructor;

{function Person(name) {this.name = name;}let obj = {age: 18,p1: new Person('lxcan')};let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj);console.log('objCopy', objCopy);console.log(obj.p1.__proto__.constructor === Person); // trueconsole.log(objCopy.p1.__proto__.constructor === Object); // true
}

image.png

6.如果对象中存在循环引用的情况也无法实现深拷贝

{let obj = {age: 18};obj.obj = obj;let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj);console.log('objCopy', objCopy);
}

image.png

以上,如果拷贝的对象不涉及上面的情况,可以使用 JSON.parse(JSON.stringify(obj)) 实现深拷贝。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/816104.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

亚马逊云科技官方重磅发布GenAI应用开发学习路线(全免费)

今天小李哥给大家分享的是亚马逊云科技(AWS)最近官方发布的GenAI应用开发最佳学习路线,不仅内容非常全面更主要的是全部免费!大家动动小手就能成为GenAI开发大🐮! 1️⃣这个GenAI开发学习路线包括什么&…

遥感卫星:探索地球的科技之旅

遥感卫星是人类探索地球、理解地球、保护地球的重要工具,其发展历程承载了人类对地球的探索与认知的历程。从最初的概念到如今的高科技应用,遥感卫星技术的发展见证了人类科技的不断进步与创新。 初心萌芽: 遥感卫星的发展始于20世纪中叶&…

C语言高质量编程之assert()和const

目录 编程中常见的错误 assert() const 编程中常见的错误 在编程中我们通常会遇到三种错误形式,分别是:编译型错误,链接型错误,运行时错误。 编译型错误: 在编译阶段发生的错误,绝大多数情况是由语法错误…

利用Sentinel解决雪崩问题(二)隔离和降级

前言: 虽然限流可以尽量避免因高并发而引起的服务故障,但服务还会因为其它原因而故障。而要将这些故障控制在一定范围避免雪崩,就要靠线程隔离(舱壁模式)和熔断降级手段了,不管是线程隔离还是熔断降级,都是对客户端(调…

vue源码解析——v-if和v-for哪个优先级高,如何避免两者同时使用

首先,官方不推荐v-if和v-for在同一个元素上使用。其次,如果两者同时使用,v-if和v-for的优先级怎么确定?在vue2和vue3中这两者的优先级顺序不一样。vue2是v-for优先,条件不存在时也会渲染多个注释节点。在vue3中进行了改…

基于51单片机的无线病床呼叫系统设计—LCD1602显示

基于51单片机的无线病床呼叫系统 (仿真+程序+原理图+设计报告) 功能介绍 具体功能: 1.病人按下按键,LCD1602显示对应的床位号; 2.多人同时呼叫,显示屏同时显示&#xf…

文献阅读:Viv:在 web 上多尺度可视化高分辨率多重生物成像数据

文献介绍 「文献题目」 Viv: multiscale visualization of high-resolution multiplexed bioimaging data on the web 「研究团队」 Nils Gehlenborg(美国哈佛医学院) 「发表时间」 2022-05-11 「发表期刊」 Nature Methods 「影响因子」 47.9 「DOI…

第17天:信息打点-语言框架开发组件FastJsonShiroLog4jSpringBoot等

第十七天 本课意义 1.CMS识别到后期漏洞利用和代码审计 2.开发框架识别到后期漏洞利用和代码审计 3.开发组件识别到后期漏洞利用和代码审计 一、CMS指纹识别-不出网程序识别 1.概念 CMS指纹识别一般能识别到的都是以PHP语言开发的网页为主,其他语言开发的网页识…

Unix环境高级编程-学习-09-多线程之读写锁与条件变量(包含线程池的部分实现与测试验证)

目录 一、多线程相关文章链接 二、自由抒发 1、读写锁 2、条件变量 三、函数介绍 1、pthread_rwlock_init (1)声明 (2)作用 (3)参数 (4)返回值 (5)…

深度学习学习日记4.14 数据增强 Unet网络部分

数据增强 transforms.Compose([:这表示创建一个转换组合,将多个数据转换操作串联在一起 transforms.RandomHorizontalFlip():这个操作是随机水平翻转图像,以增加数据的多样性。它以一定的概率随机地水平翻转输入的图像。 transfo…

29、链表-删除链表的倒数第N个结点

思路: 首先找到倒数第N个结点 第一种方式 先统计链表的节点数,然后再次遍历len-N即可得到倒数第N个结点,然后将前一个节点的next指针指向next的下一个节点使用快慢指针,快指针先跑N个结点然后慢指针开始跑,等快指针到达尾节点后…

多因子模型的因子选取

经典的Alpha模型是一些多因子模型,用于预测Alpha模型的信息比率,从而来判断判断模型的好坏。这里我们所说的信息比率是相对收益率除以非系统性风险,所以当我们在进行因子选择的时候,我们一定不能选取系统性风险模型(例…

免费VPS云服务器汇总,最长永久免费使用

目前云服务器市场竞争很激烈,为了方便吸引上云,很多云计算服务商提供免费试用云服务器,下面给大家整理汇总一下免费VPS云服务器,最长永久免费使用! 一、雨云(优惠码:ABC) 活动地址:…

2D AI交互数字人:赋能文旅、金融、政务、教育行业数字化转型

AI交互数字人结合了语音合成、语音识别、语义理解、图像处理、机器翻译、虚拟形象驱动等多项AI核心技术,可以提供服务导览、业务咨询、语音互动交流、信息播报等智能服务。 其中,2D AI交互数字人是采集真人视频,通过AI训练,生成逼…

认识OpenEuler操作系统

引言 在信息技术日新月异的时代,开源软件已成驱动创新的核心动能,其中,OpenEuler作为一款冉冉升起的开源操作系统典范,凭借其对开源精神的坚守与技术创新的不懈追求,自亮相以来便引发了全球关注。本文将全方位深挖Open…

Xcode 15.0 新 #Preview 预览让 SwiftUI 界面调试更加悠然自得

概览 从 Xcode 15 开始,苹果推出了新的 #Preview 宏预览机制,它无论从语法还是灵活性上都远远超过之前的预览方式。#Preview 不但可以实时预览 SwiftUI 视图,而且对 UIKit 的界面预览也是信手拈来。 想学习新 #Preview 预览的一些超实用调试…

使用新一代一站式 AI Bot 开发平台扣子coze,搭建我的第一个AI Bot(前端魔法师) ,

目录 1.概述​ 2.功能与优势 3.使用扣子 4.人设与回复逻辑 5.添加插件 6.预览与调试 7.发布bot Store 8.环境大家体验(给大家内置了比较屌的插件) 9.推荐阅读: 1.概述​ 扣子是新一代一站式 AI Bot 开发平台。无论你是否有编程基础…

iOS------SDWebImage源码

一,简介 一个异步图片下载及缓存的库 特性: 一个扩展UIImageView分类的库,支持加载网络图片并缓存图片异步图片下载器异步图片缓存和自动图片有效期限管理支持GIF动态图片支持WebP背景图片减压保证同一个URL不会再次下载保证无效的URL不会…

Web前端 Javascript笔记3

1、垃圾回收机制 内存中的生命周期 1、内存分配 2、内存使用(读写) 3、内存回收,使用完毕之后,垃圾回收器完成 内存泄漏:该回收的,由于某些未知因素,未释放,叫做内存泄漏 栈&#xf…

Vue新手入门

1 Vue概述 官网:https://cn.vuejs.org/ 1、什么是Vue.js Vue.js 是目前最火的一个前端框架,React是最流行的一个前端框架(React除了开发网站,还可以开发手机App, Vue语法也是可以用于进行手机App开发的,需要借助于W…