js的深拷贝与浅拷贝

一.浅拷贝: 将原对象或原数组的引用直接赋给新对象,新数组,新对象/数组只是原对象的一个引用

  1. 概念:创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型,拷贝的就是基本类型的值,如果属性是引用类型,拷贝的就是内存地址 ,所以如果其中一个对象改变了这个地址,就会影响到另一个对象。

  1. 思路:浅拷贝可以想做把引用类型的第一子级当作是每一个数据类型来赋值

  1. 实现方法:

1).Object.assign()

Object.assign(validateFormGroup.value, row)//对象浅度拷贝

2).拓展运算符(...)

3).数组Array.prototype.slice和Array.prototype.concat

arrayObject.slice(start,end)、arrayObject.concat(arrayX,...,arrayX)

二. 深拷贝:创建一个新的对象和数组,将原对象的各项属性的“值”(数组的所有元素)拷贝过来,是“值”而不是“引用”

a.概念:将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,且修改新对象不会影响原对象

b.思路:通过上述浅拷贝,这些方法都只实现了对对象的第一层元素的拷贝,但是之后层的元素还是共享的,那么我们还是结合浅拷贝的思路,参考基本类型的赋值过程,来解决这个问题。

c.实现方法:

1).递归遍历(在浅拷贝的遍历方法上多加一层判断,进而对所有层级的元素进行遍历赋值)

2).JSON.parse(JSON.stringify(XXXX))

JSON.stringify方法是把对象转成字符串,返回新生成的字符串,这一步可以看作是,把目标对象转化成基础类型后,重新开辟一个新的区域存放转化后的字符串,然后在通过JSON.parse转成JSON格式,在赋给新的对象

注意:

a.拷贝的对象的值中如果有函数,undefined,symbol类型,不会转换,而是丢弃

b.无法拷贝对象的循环应用

3).可使用Lodash 中文文档(Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库)中的_cloneDeep方法

a.首先通过npm全局安装ladash

npm i -g npm
npm i --save lodash

b.按需引入(你需要使用的函数)

import _cloneDeep from 'lodash/cloneDeep'

c._cloneDeep(value)深拷贝

var objects = [{ 'a': 1 }, { 'b': 2 }];//需要拷贝的值
var deep = _.cloneDeep(objects);//已经拷贝好的值
console.log(deep[0] === objects[0]);

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值