关于ES6的拓展运算符进行深拷贝

很多博客说ES6的拓展运算符 … 也可进行深拷贝对象，但其实是有坑的。

对象的一般格式为：

// key是键，value是值
let obj = { key ：value }

1、当value是基本数据类型，比如String，Number，Boolean时，是可以使用拓展运算符进行深拷贝的。比如：

// value是基本数据类型
let oldObj = { id: 1 }
let newObj = { ...oldObj }

oldObj.id = 2

console.log(oldObj) // {id: 2}
console.log(newObj) // {id: 1} // 不随着oldObj的改变而改变

2、但是，当value是引用类型，比如Object，Array，这时使用拓展运算符进行深拷贝，得到的结果是和深拷贝的概念有矛盾的。主要是因为引用类型进行深拷贝也只是拷贝了引用地址。比如：

// value是引用类型
let oldObj = { type: { id: 1 } }
let newObj = { ...oldObj } // 此时拷贝了{id ： 1}的引用地址

oldObj.type.id = 2 // 改变引用对象里面的值

console.log(oldObj) // {type: {id: 2}}
console.log(newObj) // {type: {id: 2}} 随着oldObj的改变而改变

oldObj.type = { id: 3 } // 改变引用的对象，实际改变了引用对象的地址

console.log(oldObj) // {type: {id: 3}}
console.log(newObj) // {type: {id: 2}} 不随着oldObj的改变而改变

总结：深拷贝最好使用lodash的cloneDeep方法或者JSON数据转换。

另外，关于Object.assign()语法进行对象的拷贝，里面的坑与拓展运算符的坑一样。

想具体了解 的知识点，参考：【ES6学习笔记之】Object.assign()