关于JavaScript深度克隆和浅度克隆的整理回顾与研究

涉及知识点(部分)
1、toString():
定义和用法
toString() 方法可把一个逻辑值转换为字符串,并返回结果。

语法
booleanObject.toString()

返回值
根据原始布尔值或者 booleanObject 对象的值返回字符串 “true” 或 “false”。

抛出
如果调用该方法的对象不是 Boolean,则抛出异常 TypeError。

注释:在 Boolean 对象被用于字符串环境中时,此方法会被自动调用。

2、hasOwnProperty:
定义和用法
hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键)。(property英文意思性质,属性,财产)
示例:

const object1 = new Object();
object1.property1 = 42;

console.log(object1.hasOwnProperty('property1'));
// expected output: true

console.log(object1.hasOwnProperty('toString'));
// expected output: false

console.log(object1.hasOwnProperty('hasOwnProperty'));
// expected output: false

3、Array.prototype.concat()(浅拷贝)

定义和用法
concat() 方法用于连接两个或多个数组。
该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

 let  arr=[1,2,3,4,{username:"kebi",age:18}];

 let  arr1=arr.concat()  // concat是连接数组,如果不传参,则表示复制原数组的数据到目标数组中

 注意:使用此方法时,数组中的基本数据类型的数据照样是生成一份新数据拷贝到新数组中,所以修改新数组的基本数据类型的数据不会影响原数组,如果修改数组中的对象,同样拷贝的是一份对象的引用到新数组中,所以修改新数组的对象会直接影响原来数组的对象数据。这跟直接赋值有一定的区别

4、Object.assign()(浅拷贝)

Object.assign方法用来将源对象(source)的所有可枚举属性,复制到目标对象(target)。它至少需要两个对象作为参数,第一个参数是目标对象,后面的参数都是源对象。

let targetObj1 = { a: 1 };
        let sourceObj1 = { b: 1 };
        let sourceObj11 = { c: 3 };
        Object.assign(targetObj1, sourceObj1, sourceObj11);
        console.log(targetObj1);
注:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

5、如果你想真正自己理解和运用深度克隆的话,首先必须要了解的就是js中的原始值和引用值,以及它们的储存位置及方式。这里简单的说一下,原始值呢是存储在栈里的,而且存储的是变量的实际值。引用值存储在堆里,且存储的是一个指针,该指针指向内存中的某个位置,该位置存储变量的实际值。

拷贝数据分为两种类型:

1、基本数据类型:拷贝后会生成一份新的数据,修改拷贝以后的数据不会影响原数据(没有深浅拷贝之说)

2、对象/数组:拷贝后不会生成新的数据,而拷贝的是引用,修改拷贝以后的数据会影响原来的数据(有深浅拷贝之说)

浅度/深度克隆学习心得:

拷贝的数据里不能有函数,处理不了,浅拷贝,拷贝的是引用,修改拷贝以后的数据会影响原数据;深拷贝(深度克隆),拷贝时生成新数据,修改不会影响原数据。(注意:影响原数据的是浅拷贝)

OK~ 今天暂时整理到这里,希望能对看到这篇文章的你有所帮助,如果觉得有不妥或是更好的想法,欢迎指出,互相交流共同进步!

1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看rEADME.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。 1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看rEADME.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。 1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值