900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 数组深拷贝_JavaScript之深浅拷贝

数组深拷贝_JavaScript之深浅拷贝

时间:2023-08-19 16:17:12

相关推荐

数组深拷贝_JavaScript之深浅拷贝

前面给大家分享过了JavaScript的类型判断,今天来跟大家分享一下JavaScript的深浅拷贝。

1. 数组的浅拷贝

如果是数组,我们可以利用数组的一些方法比如:slice、concat 返回一个新数组的特性来实现拷贝。比如:

用 slice 可以这样做:var new_arr = arr.slice();

但是如果数组嵌套了对象或者数组的话,比如:

我们会发现,无论是新数组还是旧数组都发生了变化,也就是说使用 concat 方法,克隆的并不彻底。如果数组元素是基本类型,就会拷贝一份,互不影响,而如果是对象或者数组,就会只拷贝对象和数组的引用,这样我们无论在新旧数组进行了修改,两者都会发生变化。

我们把这种复制引用的拷贝方法称之为浅拷贝,与之对应的就是深拷贝,深拷贝就是指完全的拷贝一个对象,即使嵌套了对象,两者也相互分离,修改一个对象的属性,也不会影响另一个。所以我们可以看出使用 concat 和 slice 是一种浅拷贝。

2. 数组的深拷贝

那如何深拷贝一个数组呢?这里介绍一个技巧,不仅适用于数组还适用于对象!那就是:

是一个简单粗暴的好方法,就是有一个问题,不能拷贝函数,我们做个试验:

我们会发现 new_arr 变成了:

3. 浅拷贝的实现

以上三个方法 concat、slice、JSON.stringify 都算是技巧类,可以根据实际项目情况选择使用,接下来我们思考下如何实现一个对象或者数组的浅拷贝。

想一想,好像很简单,遍历对象,然后把属性和属性值都放在一个新的对象不就好了~

嗯,就是这么简单,注意几个小点就可以了:

4. 深拷贝的实现

那如何实现一个深拷贝呢?说起来也好简单,我们在拷贝的时候判断一下属性值的类型,如果是对象,我们递归调用深拷贝函数不就好了~

尽管使用深拷贝会完全的克隆一个新对象,不会产生副作用,但是深拷贝因为使用递归,性能会不如浅拷贝,在开发中,还是要根据实际情况进行选择。

学习相关推荐(编程必备辅助):

①:搜索关注公众号“只会写BUG”,分享更多干货知识,资讯,教程等

②:海量编程类资料零基础到高级亟待领取!!!

如果觉得对你有一丢丢帮助,麻烦动动你的小手指【关注】一下上面的公众号吧,或者【转发】让更多人看到该文章。大家也可积极后台给我留言,多多交流,共同进步。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。