js对象拷贝问题
js对象拷贝问题
-
直接赋值
我们尝试直接定义两个对象objectA={a:10} 和 objectB,然后直接把objectA赋值给objectB也就是objectB = objectA,赋值还是赋地,学过C的同学应该不难想到取址打印出来一目了然了,但是JS没有取址,我们尝试着修改objectB.a值,再输出objectA.a发现已经被修改了,所以js直接赋值是传了个地址指针过去。 -
浅拷贝
浅拷贝只会赋值制对象的非对象属性,不会指向同一个地址。ES6中有个浅拷贝的方法Object.assign(target, …sources)。我们还是动手一下
从上图我们不难看出来浅拷贝就是拷贝对的非对象属性才是值拷贝,对象属性还是地址拷贝
ES6中浅拷贝还有更加简便的展开符赋值:
类似的数组也有展开符,ES6的很多扩展符还是很方便的,要学会去用 -
深拷贝
深拷贝会另外拷贝一份一个一模一样的对象,但是不同的是会从堆内存中开辟一个新的区域存放新对象,新对象跟原对象不再共享内存,修改赋值后的对象b不会改到原对象a。即深拷贝,修改赋值后的对象b的非对象属性,不会影响原对象a的非对象属性;修改赋值后的对象b的对象属性,也不会影响原对象a的对象属性。而且,二者不指向同一个对象。
深拷贝会用到两个方法JSON.stringify()和JSON.parse(),序列化与反序列化,话不多说动手
对象拷贝的应用还是挺多的,在vue和小程序中处理数据的时候你体会比较深