最近的学习中,仔细研究了下深拷贝和浅拷贝,下面就来简单的总结下。
数据类型
首先我们了解下两种数据类型:
1、基本类型:像 Number、String、Boolean 等这种为基本类型
2、复杂类型:Object 和 Array
浅拷贝与深拷贝的概念
接着我们分别来了解下浅拷贝和深拷贝,深拷贝和浅拷贝是只针对 Object 和 Array 这样的复杂类型的。
浅拷贝:
1 2 3 4 5 6 7 8 |
var a = { myname: 'yana' }; var b = a; b.myname = '小雅'; console.log(b.myname); // 小雅 console.log(a.myname); // 小雅 |
1 2 3 4 5 6 |
var a = ['myname', 'yana']; var b = a; b[1] = '小雅'; console.log(a); // ["myname", "小雅"] console.log(b); // ["myname", "小雅"] |
可以看出,对于对象或数组类型,当我们将 a 赋值给 b,然后更改 b 中的属性,a 也会随着变化。
也就是说 a 和 b 指向了同一块内存,所以修改其中任意的值,另一个值都会随之变化,这就是浅拷贝。
深拷贝:
刚刚我们了解了什么是浅拷贝,那么相应的,如果给 b 放到新的内存中,将 a 的各个属性都复制到新内存里,就是深拷贝。
也就是说,当 b 中的属性有变化的时候,a 内的属性不会发生变化。
浅拷贝
那么除了上面简单的赋值引用,还有哪些方法使用了浅拷贝呢?
Object.assign()
在 MDN 上介绍 Object.assign():"Object.assign() 方法用于将所有可枚举的属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。"
复制一个对象
1 2 3 4 5 6 7 |
var target = {a: 1, b: 1}; var copy1 = {a: 2, b: 2, c: {ca: 21, cb: 22, cc: 23}}; var copy2 = {c: {ca: 31, cb: 32, cd: 34}}; var result = Object.assign(target, copy1, copy2); console.log(target); // {a: 2, b: 2, c: {ca: 31, cb: 32, cc: 33}} console.log(target === |