如何实现数组深拷贝和浅拷贝?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何实现数组深拷贝和浅拷贝?相关的知识,希望对你有一定的参考价值。

参考技术A 如何实现数组深拷贝和浅拷贝?

1.背景介绍

javascript分原始类型与引用类型。Array是引用类型,直接用“=”号赋值的话,只是把源数组的地址(或叫指针)赋值给目的数组,并没有实现数组的数据的拷贝。这种方式的实现属于浅拷贝。

深拷贝是开辟新的储存空间,两个对象对应两个不同的地址,修改一个对象的属性,不会改变另一个对象的属性。

2.知识剖析

一维数组的深拷贝方法:slice()和concat()

slice()的使用方法

slice()语法:arrayObj.slice(start,[end])

slice方法是通过参数start和end的传入值来返回数组中的一段,该方法不对原数组进行操作,而是返回一个子数组

start:必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。

end:可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

返回值:返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素(如果 end 未被规定,那么 slice() 方法会选取从 start 到数组结尾的所有元素)。

concat()的使用方法

concat()语法:arrayObject.concat(arrayX,arrayX,......,arrayX)

arrayX:必需,可以是具体的值,也可以是数组对象。可以是任意多个。

concat() 方法用于连接两个或多个数组。 该方法不会改变现有的数组,而仅仅会返回一个新的数组。如果要进行 concat() 操作的参 数是数组,那么添加的是数组中的元素,而不是数组。

3.常见问题

1、jquery中数组深拷贝办法

语法:jQuery.extend( [deep ], target, object1 [, objectN ] )

将两个或更多对象的内容合并到第一个对象。

deep:可选。 Boolean类型 指示是否深度合并对象,默认为false。如果该值为true,且多个对象的某个同名属性也都是对象,则该"属性对象"的属性也将进行合并。

2、什么是深拷贝?

深拷贝:指的是拷贝一个对象时,不仅仅把对象的引用进行复制,还把该对象引用的值也一起拷贝。这样进行深拷贝后的拷贝对象就和源对象互相独立,其中任何一个对象的改动都不会对另外一个对象造成影响。举个例子,一个人叫张三,然后使用克隆技术以张三来克隆另外一个人叫李四,这样张三和李四就是相互独立的,不管张三缺胳膊还是李四少腿了都不会影响另外一个人。在.NET领域,值对象就是典型的例子,如int, Double以及结构体和枚举等。

3、什么是浅拷贝呢?

浅拷贝:指的是拷贝一个对象时,仅仅拷贝对象的引用进行拷贝,但是拷贝对象和源对象还是引用同一份实体。此时,其中一个对象的改变都会影响到另一个对象。例如,一个人一开始叫张三,后来改名字为张老三了,可是他们还是同一个人,不管张三缺胳膊还是张老三少腿,都反应在同一个人身上。在.NET中引用类型就是一个例子。

4 解决方案

jquery.extend()

语法:jQuery.extend( [deep ], target, object1 [, objectN ] )

将两个或更多对象的内容合并到第一个对象。

deep:可选。 Boolean类型 指示是否深度合并对象,默认为false。如果该值为true,且多个对象的某个同名属性也都是对象,则该"属性对象"的属性也将进行合并。

5.编码实战

6.扩展思考

slice和concat对数组深拷贝的局限性

slice和concat这两个方法,仅适用于对不包含引用对象的一维数组的深拷贝。对于数组内部存在对象和数组,当改变对象属性和内部数组的元素后,深拷贝的数组同样也发生了改变。

什么是深拷贝和浅拷贝以及如何实现深拷贝

简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果A没变,那就是深拷贝,自食其力。

此篇文章中也会简单阐述到栈堆,基本数据类型与引用数据类型,因为这些概念能更好的让你理解深拷贝与浅拷贝。

我们来举个浅拷贝例子:

let a=[0,1,2,3,4],
b=a;
console.log(a===b);
a[0]=1;
console.log(a,b);

嗯?明明b复制了a,为啥修改数组a,数组b也跟着变了,这里我不禁陷入了沉思。

那么这里,就得引入基本数据类型与引用数据类型的概念了。

面试常问,基本数据类型有哪些,number,string,boolean,null,undefined五类。

引用数据类型(Object类)有Object,Array,Date等。

而这两类数据存储分别是这样的:

a.基本类型--名值存储在栈内存中,例如let a=1;

当你b=a复制时,栈内存会新开辟一个内存,例如这样:

所以当你此时修改a=2,对b并不会造成影响,因为此时的b已自食其力,翅膀硬了,不受a的影响了。当然,let a=1,b=a;虽然b不受a影响,但这也算不上深拷贝,因为深拷贝本身只针对较为复杂的object类型数据。

b.引用数据类型--名存在栈内存中,值存在于堆内存中,但是栈内存会提供一个引用的地址指向堆内存中的值,我们以上面浅拷贝的例子画个图:

当b=a进行拷贝时,其实复制的是a的引用地址,而并非堆里面的值。

而当我们a[0]=1时进行数组修改时,由于a与b指向的是同一个地址,所以自然b也受了影响,这就是所谓的浅拷贝了。

那,要是在堆内存中也开辟一个新的内存专门为b存放值,就像基本类型那样,起步就达到深拷贝的效果了

参考技术A

43.避免对象的浅拷贝

拷贝是在内存中进行,不通过new对象的性能高

浅拷贝:只拷贝基本类型性的成员变量(值),没有对成员对象实现拷贝(拷贝的是引用地址)

(1)少量类的深拷贝:拷贝类和成员对象实现Cloneable接口并实现clone方法。(本例)

(2)大量类的深拷贝:每个类是向clone方法,工作量太大了,可以使用序列化拷贝 (44例子)

(3)当然除了自己实现序列化拷贝,可以直接使用Apache下common工具类SerializationUtil

序列化深拷贝

以上是关于如何实现数组深拷贝和浅拷贝?的主要内容,如果未能解决你的问题,请参考以下文章

深拷贝和浅拷贝的区别 & 如何实现深拷贝和浅拷贝

JavaScript深拷贝和浅拷贝数组

javascript深拷贝和浅拷贝以及实现方法(推荐)

JS-[浅拷贝和深拷贝]

深拷贝与浅拷贝的实现(一)

javascript实现引用数据类型的深拷贝和浅拷贝详解