Object.assign()浅拷贝和深拷贝

首先了解下Object.assign()是什么。

ES6官方文档介绍：Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

注意：Object.assign() 方法至少需要两个对象作为参数，第一个参数是目标对象，后面的参数都是源对象。

Object.assign()可以是深拷贝也可以是浅拷贝

let a1 = { name: '张三', innerObj: { address: '中国' } }
let a2 = { age: 18 }

以上方数据为例 我们先说浅拷贝

let a3 = Object.assign(a2, a1)
 console.log('a1:', a1)
 console.log('a2:', a2)
 console.log('a3:', a3)

以此方式传参便是浅拷贝。将a1的值合并到a2中，再将合并后的a2的引用赋值给a3

控制台输出内容↑

验证：

a2.name = '李四'

我们将a2中的name属性值修改为李四 

在控制台的输出中可见a3中的name值也变成了李四，故此可以证明a3和a2的引用地址是一样的。

我们再以相同的数据说说Object.assign()方法的深拷贝：

let a3 = Object.assign({}, a2, a1)

以此方式传参便是深拷贝。第一个参数传入了一个空得对象，将a2和a1中得数据合并到第一个空对象中并赋值给a3

 

控制台输出内容↑

a1和a2依旧是本身得样子，a3打出得数据是a1和a2之和

验证：

a3.name = '李四'

 

我们将a3中的name属性值修改为李四，在控制台的输出中可见a1中的name值并没有受到影响，故此可以证明a3和a1的引用地址是不一样的。

注意：Object.assign()方法无法对嵌套得引用类型数据深拷贝，还是以上方的数据为例。

      let a1 = { name: '张三', innerObj: { address: '中国' } }
      let a2 = { age: 18 }
      let a3 = Object.assign({}, a2, a1)

      a1.innerObj.address = '亚洲'
      console.log('a1:', a1)
      console.log('a2:', a2)
      console.log('a3:', a3)

我们修改a1中innerObj对象中的address的值为亚洲

 

在控制台的打印结果中 a3中的数据也受到了影响，足以说明此处的address是浅拷贝，引用地址是一样的。