深拷贝与浅拷贝

       平时在开发过程中我们会经常遇到对于数组以及对象的操作,因为数组、对象可以对多条数据进行存储,并且存在内置方法可以很好地遍历、读取他们,但是有些时候如果我们需要改变存储在里面的数据,不恰当的操作往往会导致修改结果跟自己预期结果不太一样,这是由于数组、对象属于引用数据类型造成。

      引用数据类型:他们存储的不是真实的数据,而是指向真实数据的地址的引用,当你直接修改数组或者对象的值时,那么真实数据会同步修改,这就会导致所有指向它们的数组和对象的引用的值都会被修改。以下文为例:

 所以我们平时在开发过程中如果涉及到需要修改数组或者对象中的值的情况,就需要重新拷贝一份数据来进行操作,然后再将操作完毕后的数据存储起来,避免在操作过程中造成原数据的修改。

而其中拷贝方法的不同,就分为深拷贝与浅拷贝两个概念。

1、浅拷贝

单纯地就是给一个变量赋值为数组/对象(类似于上述图片中的例子),这样的拷贝方式会使不同的两个变量产生关联,由于它们指向同一个存储数据的引用地址,无论哪方进行修改,另一方的数据都会相应的改变。

2、深拷贝

重新创建一个数组/对象,通过一些操作,只是将原数组/对象中的值原封不动的复制给它,这样两个变量之间就不会产生关联,例如以下几种方法:

(1)递归赋值,由于对象存储的就是键值对【数组存储的也是键值对,不过键是由一些数字组成,是一种特殊的对象】。通过遍历原对象,依次将值赋给新对象,因为可能原对象中又存储了一个引用数据类型,所以需要通过递归方法来进行不同的处理,如果是简单数据类型则直接赋值,如果是引用数据类型则继续遍历,直到遍历到最底层的简单数据类型,然后一层一层再由内而外将它赋值给新对象中对应的键上。(如果就拷贝数据而言该方法比较耗费性能,不建议使用,这里只是提出这个方法供参考)

 (2)Object.assign()方法【对数组也有相同作用,Object.assign([], arr)】

       用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。(该方法只能拷贝存储了简单数据类型的对象,如果对象中存储了引用数据类型,则修改该引用数据类型的值,拷贝对象中相应的也会发生改变。因为assign方法只是简单地遍历第一层属性,并赋值给目标对象,不会考虑更深层级数据的拷贝)

 (3)JSON.parse()以及JSON.stringify()

先通过JSON.stringify方法将原对象变成一个字符串,然后再将该字符串通过JSON.parse方法转化为一个对象,这样两个变量之间就不会存在关联。(该方法可以对更深层级的数据引用类型统一进行深拷贝,是目前最为便利的深拷贝方式)

(4)$.extend(),jquery的extend方法

格式:$.extend(true/false, {},  targetObj, targetObj2..)

jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。

注意:

1. 如果只为$.extend()指定了一个参数,则意味着参数target被省略。此时,target就是jQuery对象本身。通过这种方式,我们可以为全局对象jQuery添加新的函数。
2. 如果多个对象具有相同的属性,则后者会覆盖前者的属性值。

 

 

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值