图解 JS 浅拷贝与深拷贝

深拷贝和浅拷贝的区别就在于: 深拷贝的对象的改变不会影响原对象的改变, 浅拷贝反之

实现浅拷贝

     var obj1= {a: 0}
        //  实现浅拷贝
        var obj2 = obj1;
        obj2.a = 1;
        console.log("obj1.a", obj1.a)
        console.log("obj2.a", obj2.a)

在这里插入图片描述

2、ES6扩展运算符,实现 深拷贝

      var obj1= {a: 0}
        // 实现深拷贝
        var obj3= {...obj1}
        obj3.a = 2;
        console.log("obj1.a", obj1.a)
        console.log("obj3.a", obj3.a)

在这里插入图片描述

3、Object.assign() 实现 深拷贝

 var obj1= {a: 0}
        // 实现深拷贝
        // var obj3= {...obj1}
        // obj3.a = 2;
        // console.log("obj1.a", obj1.a)
        // console.log("obj3.a", obj3.a)
        // Object.assign()实现深拷贝
        var obj4 = Object.assign({}, obj1)
        obj4.a = 3;
        console.log("obj1.a", obj1.a)
        console.log("obj4.a", obj4.a)

在这里插入图片描述

新城大海
关注 关注
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JS浅拷贝深拷贝原理与实现方法分析
12-11
本文实例讲述了JS浅拷贝深拷贝原理与实现方法。分享给大家供大家参考,具体如下: 浅拷贝只会拷贝一层,深层的引用类型改变还是会受到影响。 深拷贝是所有内部的属性还有值都被拷贝了一份,不管深层的引用类型怎么改都不会受到影响。 浅拷贝的实现方式 1、自定义函数 function shallowClone (initalObj) { var obj = {}; for ( var i in initalObj) { obj[i] = initalObj[i]; } return obj; } 2、ES6 的 Object.assign() let newObj
通俗易懂解释javaScript深拷贝浅拷贝(有图有真相)
程宇寒
04-03 484
通俗易懂解释javaScript深拷贝浅拷贝(有图有真相)
详细讲解js中的深拷贝浅拷贝
热门推荐
zhang_cherry的博客
09-27 2万+
深拷贝浅拷贝在其它语言中也经常被提及到,在实际项目开发过程中也常常需要区分当前使用的到底是深拷贝还是浅拷贝,有时候在该使用深拷贝的地方,我们使用了浅拷贝,会导致深藏不露的bug。
js中深浅拷贝的实现方式(含图解原理)
weixin_42467467的博客
05-15 1774
关于赋值,浅拷贝深拷贝 提前熟知: 栈内存(stack):会自动分配的内存空间,它由系统自动释放 堆内存(heap):动态分配的内存及大小,不一定会自动释放 基本数据类型:String, Number, Boolean, undefined, null, Symbol 引用数据类型:Object, Array, Function 在JS中,数据类型分为基本数据类型和引用数据类型两种,对于基本数据类型来说,它的值直接存储在栈内存中,而对于引用类型来说,它在栈内存中仅仅存储了一个引用,而真正的数据存储在堆
JS中的深拷贝浅拷贝区别图解
m0_46387873的博客
03-22 336
浅拷贝浅拷贝这个东西是十分基础的,它涉及到了堆栈的问题,如果想要理解深浅拷贝的区别,首先要明白堆和栈的区别。 所以我们先来说一说堆和栈的区别: 堆和栈你可以当成计算机内存中的两个不同的大盒子,不同的数据类型放在不同的盒子里。 我们都知道数据类型分为两种:简单数据类型和复杂数据类型。复杂数据类型就是数组、对象、函数这三个,其他的就是简单数据类型。简单数据类型呢就是放在栈中,复杂数据类型的内容放...
图解:python中的浅拷贝深拷贝
12-21
图解:python中的浅拷贝深拷贝 首先,我们考虑这样一个场景:在该场景中,我们各种列表的颜色,每个颜色代表假定颜色类的一个实例。比如,由一个warmtones列表表示现有的颜色,warmtones = list(''red","green",...
JavaScript源代码】详解JS变量存储深拷贝浅拷贝.docx
12-29
 目录 变量类型与存储空间栈内存和堆内存基本数据类型引用类型图解存储空间引用类型的赋值深拷贝浅拷贝深拷贝浅拷贝对象的赋值三者对比浅拷贝的常用的五种方法Object.assign()扩展运算符Array.prototype.slice...
图解Python中深浅copy(通俗易懂)
09-16
主要介绍了图解Python中深浅copy(通俗易懂),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
mysql数据库备份与还原图解.pdf
11-16
mysql数据库备份与还原图解.pdf
Javascript深拷贝
weixin_34288121的博客
08-01 618
javascript深拷贝是初学者甚至有经验的开发者,都会经常遇到问题,并不能很好的理解javascript深拷贝深拷贝(deepClone)? 与深拷贝相对的就是浅拷贝,很多初学者在接触这个感念的时候,是很懵逼的。 为啥要用深拷贝? 在很多情况下,我们都需要给变量赋值,给内存地址赋予一个值,但是在赋值引用值类型的时候,只是共享一个内存区域,...
JS之深浅拷贝详解
前端菜菜DayDayUp的博客
09-13 3644
1、深拷贝浅拷贝的区别 如何区分深拷贝浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝;如果B没变,那就是深拷贝。 2、栈堆、基本数据类型、引用数据类型 栈堆:存放数据的地方 基本数据类型:number,string,boolean,null,undefined 引用数据类型:function,Array,object tips:基本数据类型保存在栈内存,引用类型保存在堆内存中。根本原因在于保存在栈内存的必须是大小固定的数据,引用类型的
JS浅拷贝深拷贝详解
磷火的博客
02-21 2127
简单的来说就是,在有指针的情况下,浅拷贝只是增加了一个指针指向已经存在的内存,而深拷贝就是增加一个指针并且申请一个新的内存,使这个增加的指针指向这个新的内存,采用深拷贝的情况下,释放内存的时候就不会出现在浅拷贝时重复释放同一内存的错误! 在js中,对于非基本类型数据(普通对象或数组),浅拷贝只是拷贝了内存地址,子类属性指向父类属性的内存地址,而子类修改后父类也会被修改 看程序
js浅拷贝深拷贝
weixin_46077178的博客
03-29 76
js浅拷贝深拷贝 浅拷贝 对于基本类型的值,进行浅拷贝时,将一个变量复制给另一个变量,相当于创建了一个新值,两个变量是独立的,不会互相影响。举个例子: var a = 2; var b = a; a = 5; console.log(a); //5 console.log(b); //2 对于引用类型值,进行浅拷贝时,实际上只是将操作的对象的引用复制给另一个变量,两个变量指向同一个内存中的变量...
js深拷贝浅拷贝
linglingzi001的博客
04-12 111
浅拷贝 只是拷贝一层,更深层次对象级别的只拷贝引用 var obj = { id: 1, name: "andy", msg:{ age:18 } } var o = {}; for (var k in obj) { ...
JavaScript学习(七十五)—图解浅拷贝深拷贝
道阻且长,行则将至。
05-16 379
JavaScript学习(七十五)—图解浅拷贝深拷贝 浅拷贝 浅拷贝只是拷贝一层,更深层次对象级别的只拷贝引用 Object.assign(target, ...sources);ES6新增方法可以浅拷贝 深拷贝
JS中一个dom元素能绑定多少事件
ggq53219的博客
06-10 550
JavaScript中,一个DOM元素可以绑定的事件数量并没有明确的限制,这主要取决于浏览器的实现和内存限制。然而,在实际应用中,为同一个DOM元素绑定过多的事件监听器可能会导致性能问题,尤其是在事件处理函数执行复杂操作的情况下。总之,虽然JavaScript中DOM元素可以绑定的事件数量没有明确的限制,但在实际应用中应注意避免过度绑定和优化事件处理函数,以确保良好的性能和用户体验。
Harmony 开发的艺术 面向对象
不懂先生的博客
06-13 1059
然后你可以创建多个子类,如“圆形”、“矩形”和“三角形”,它们都继承自“形状”类并实现了自己的“绘制”方法。尽管每个对象的类型可能不同(圆形、矩形、三角形等),但由于它们都继承了“形状”类并实现了相同的“绘制”方法,因此你可以通过父类引用来统一调用它们的方法。然后你可以创建一个“狗”类,它继承自“动物”类,并添加或覆盖一些特定的属性和方法(如“叫”和“摇尾巴”)。所以面向对象的三大特征(封装、继承、多态)在java语言中很容易实现的设计,搬到早期的JavaScript中,就变噩梦一样的存在。
JS-12-es6常用知识-async
最新发布
m0_68467925的博客
06-13 580
关键字async作用:声明一个函数为异步函数,允许函数内部使用await关键字等待 Promise 对象的完成。返回值:异步函数总是返回一个 Promise 对象,无论函数内部是否有显式的return语句。如果没有返回语句,函数会隐式地返回一个已解析(resolved)的 Promise,其值为undefined。
第二十一节:带你梳理Vue2: 父组件使用子组件时的修饰符和双向数据绑定
我们专注于分享最实用的编程技术和干货,帮助你提升编程能力,感谢您的支持和关注!
06-10 1270
原生事件修饰符.native ,关于组件标签上的事件 在组件标签上是没办法触发原生的js事件的,vue会将其作为自定义事件处理
linux dma拷贝数据到用户态,图解:零拷贝Zero-Copy技术大揭秘
06-13
好的,下面我来为您图解一下Linux DMA拷贝数据到用户态的零拷贝(Zero-Copy)技术。 首先,我们需要了解什么是DMA(Direct Memory Access,直接内存访问)技术。DMA是一种数据传输技术,它允许外设直接访问系统内存...

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
写文章

热门文章

  • 微信小程序中picker的使用 8079
  • react 路由传参及获取参数 7616
  • 使用adb命令安装安卓apk包 7548
  • js从数组中随机取出其中三个元素 6368
  • H5实现扫码读取二维码条形码功能(二维码+条形码) 5479

最新评论

  • 前端项目部署到腾讯云服务器

    _i_look_: WeTerm

  • 前端项目部署到腾讯云服务器

    _i_look_: 你好,可以发我一个WetTerm的安装包吗,外面下载不了

  • js从数组中随机取出其中三个元素

    CarrieWYZ: 方法一已经用splice删除获取过的值啦,应该不会重复的(目前只学到方法一)

  • vue2+ts中Prop的使用

    新城大海: vue-property-decorator 的npm上面有相关的写法表情包

  • Redux使用教程

    越走越远的风: 不说版本,上来就教程的都是耍流氓表情包

大家在看

  • 精品酒销售管理系统 439
  • 4-字符串-21-反转字符串 II-LeetCode541
  • 自学黑客(网络安全) 2339
  • 一文搞懂雷达脉冲压缩和匹配滤波器 1729
  • LeetCode 300. 最长递增子序列 1017

最新文章

  • H5实现扫码读取二维码条形码功能(二维码+条形码)
  • webpack配置-打包图片资源
  • vue + element +table前端导出xlxs表格的数据
2023年1篇
2022年10篇
2021年87篇
2020年7篇

目录

目录

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值

深圳SEO优化公司清远百度网站优化多少钱德宏网站制作设计报价临夏关键词按天计费价格盐城模板制作西乡网站推广方案价格鄂州高端网站设计淄博seo排名多少钱爱联企业网站建设陇南网站搜索优化多少钱漯河营销网站哪家好南平网站关键词优化哪家好白山建网站报价云浮外贸网站设计公司西宁品牌网站设计报价保定外贸网站制作推荐坪山高端网站设计哪家好吴忠网站搭建多少钱和田设计公司网站推荐平湖阿里店铺运营价格鹤壁关键词排名公司吉林网站设计报价宜宾网站推广系统价格许昌seo优化报价滁州seo多少钱济南SEO按天收费黄南优化价格德州seo网站优化多少钱长葛百姓网标王多少钱宜宾企业网站设计价格石岩建网站报价歼20紧急升空逼退外机英媒称团队夜以继日筹划王妃复出草木蔓发 春山在望成都发生巨响 当地回应60岁老人炒菠菜未焯水致肾病恶化男子涉嫌走私被判11年却一天牢没坐劳斯莱斯右转逼停直行车网传落水者说“没让你救”系谣言广东通报13岁男孩性侵女童不予立案贵州小伙回应在美国卖三蹦子火了淀粉肠小王子日销售额涨超10倍有个姐真把千机伞做出来了近3万元金手镯仅含足金十克呼北高速交通事故已致14人死亡杨洋拄拐现身医院国产伟哥去年销售近13亿男子给前妻转账 现任妻子起诉要回新基金只募集到26元还是员工自购男孩疑遭霸凌 家长讨说法被踢出群充个话费竟沦为间接洗钱工具新的一天从800个哈欠开始单亲妈妈陷入热恋 14岁儿子报警#春分立蛋大挑战#中国投资客涌入日本东京买房两大学生合买彩票中奖一人不认账新加坡主帅:唯一目标击败中国队月嫂回应掌掴婴儿是在赶虫子19岁小伙救下5人后溺亡 多方发声清明节放假3天调休1天张家界的山上“长”满了韩国人?开封王婆为何火了主播靠辱骂母亲走红被批捕封号代拍被何赛飞拿着魔杖追着打阿根廷将发行1万与2万面值的纸币库克现身上海为江西彩礼“减负”的“试婚人”因自嘲式简历走红的教授更新简介殡仪馆花卉高于市场价3倍还重复用网友称在豆瓣酱里吃出老鼠头315晚会后胖东来又人满为患了网友建议重庆地铁不准乘客携带菜筐特朗普谈“凯特王妃P图照”罗斯否认插足凯特王妃婚姻青海通报栏杆断裂小学生跌落住进ICU恒大被罚41.75亿到底怎么缴湖南一县政协主席疑涉刑案被控制茶百道就改标签日期致歉王树国3次鞠躬告别西交大师生张立群任西安交通大学校长杨倩无缘巴黎奥运

深圳SEO优化公司 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化