vue.js 拷贝数组和对象_ES6对象的扩展（下）

承接昨晚没写完的。。

ES6对象的扩展(上)

对象的扩展运算符

用于取出参数对象的所有可遍历属性，拷贝到当前对象之中。

同数组的扩展运算符类似 ，ES6(好像不是ES6的，可能是ES218的，因为我发现有的浏览器不支持)对对象也新增了对象操作符，其作用就是可以让我们快速的截取对象(我这样理解可以有问题，大家看我后面的例子来作出自己的理解)，拷贝对象。

嗯，我们先来说拷贝对象吧。

与数组的扩展运算符克隆数组类似。

// 克隆数组let arr = [1,2,3,4,5]let arrClone = [...arr]console.log(arrClone)

对象克隆是在被克隆的对象外包一个对象符号，然后三个点后跟上被克隆的对象：

let 我是一个接收克隆对象的遍历 = {...我是被克隆的对象}

大家都知道，我们一般给直接 使用赋值接收的引用类型(数组或对象)只是浅拷贝(只是复制了一份指针的意思，其中一个变了另一个也发生变化)。

而我们使用扩展运算符拷贝到的是深拷贝(假如指针是钥匙，内存空间是一套房子的话，浅拷贝相当于给你一把钥匙深拷贝则不是只给你一把钥匙，而是给了你一套房)

对象的扩展运算符对数组同样起效

因为在js中，数组本质上其实是特殊形式的对象，当我们使用对象的扩展运算符来操作数组时：

它会把这个数组转化成对象，数组的下标作为对象的属性名，数组的下标所对应的值会作为对象的属性值！

对象的扩展运算符对字符串有奇效

和转换数组类似，它会把字符串的下标(使用str.indexOf('该字符串里的某个字符')可以获取字符串的下标)作为对象的属性名，字符串下标对应的字符作为属性值。

如果我们在操作扩展运算符的同时，添加有自定义属性，则类似于 Object.assign()拼接对象(在我昨晚写的ES6对象的扩展上里有讲)。但是如果你在扩展运算符往后添加的属性名和扩展运算符里的属性名重复了，则后者会覆盖前者！

解构赋值

ES6解构赋值 之前写过一篇专门讲解构赋值的。

对象的解构赋值用于从一个对象取值，然后赋值给一个变量之中。

等号左边是要复制的变量，等号右边是你要取值的对象。需要注意一点就是这种方式的解构赋值其等号左边的变量名要与对象的属性名保持一致,否则只能取到undefined。顺序到时无所谓。

当然，有时候我们不想让等号左边的变量名和对象的属性名保持一致，我们可以通过取别名的方式！

在和对应对象属性名的变量后面加上 ‘：’号，后跟上你要起的变量名即可。

我们可以在对象的解构赋值中使用对象的扩展运算符(这就是我为什么先说扩展运算符的原因！我太机智了)

如果我们想拿到对象中还没有解构的其它属性，则使用 ...接收全部没有解构属性的变量名 ，这样你会拿到一个对象，对象里包含所有没有解构的属性。

关于对象的解构赋值，如果大家写小程序应该会隐藏用到，因为小程序返回的事件对象中，有用的一般为detail属性

比如：