...展开语法

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第7天，点击查看活动详情。

关于...展开语法的个人常用套路。

1.对象中的展开语法用于取出参数对象中的所有可遍历属性，拷贝到当前对象。 那么利用这一个属性，我们就可以对两个对象进行整合。因为有时候我们同时需要自定义data中的icon数据，和后台传入给我们的数组对象。这个时候我们就可以通过展开语法和结构赋值实现对对象中不同key的合并

let a = {
    name:'55',
    age:18
}
let b = {
    work:'coder',
}
let c = {...a,...b}     //同时打印出name，age和work

2.如果扩展运算符后面是字符串，它会自动转成一个类似数组的对象。举个栗子。

let string = 'facai'
let a = [...string]
let b = {...string}
console.log(a)
console.log(b)

此时你会发现a打印的是['f','a','c','a','i'], b打印的是{0:'f',1:'a',2:'c',3:'a',4:'i'}

3.扩展运算符可以用于数组的结构赋值。当我们只需要数组的某一部分，而不需要它的全部的时候，我们也可以通过数组的结构赋值来实现拿到想要的那部分的数据。例如：

let [a,...b] = [1,2,3]

在我们分别需要取不同部分数组的数据的时候，我们就可以通过结构赋值和...展开运算符来取。 当然，需要注意的是，也是在日常开发中可能遇到的情况，那就是展开语法如果是作用在数组的情况下，只能在后面，就像代码中看到的，如果a和...b一旦更换位置，那么就会报错。

4.展开运算符也可用作在方法传参的时候使用，例如：

function sum(x,y,z){
  return x+y+z
}
let a = [1,2,3]
console.log(sum(...a))

你就会发现自动将a数组中的数据一一展开用作参数。

展开运算符合结构赋值在es6中，在日常的实际开发中能帮我们节省很多的代码量，也可以让我们的代码更优雅。所以这部分的学习还是非常有必要的。

本人是萌新小白，如果有说的不好的地方，希望大佬多多指正，感谢各位技术大牛。