JavaScript的参数扩展与收集

es6新出了扩展操作符用...表示，用途就是：

1、简洁的操作和组合集合数据

2、定义函数的参数列表，利用的就是js参数长度可变的特点

在没有扩展符之前，假设要将一个数组的每个元素作为参数传到函数就得求助于apply方法了
代码如下：

const arr = [1,2,3,4]
function getTotal(){
  let total = 0
  for(let i = 0; i<arguments.length; i++){
      total += arguments[i] 
  }
  return total 
}
getTotal.apply(null,arr) // 10

在es6之后我们可以更简洁的完成上述功能

getTotal(...arr) // 10

//我们扩展符作为参数传到函数里面，不用关他的位置
getTotal(1,...arr) //11
getTotal(...arr,1)//11

令人惊喜的是扩展符可以在箭头函数中使用，众所周知，arguments伪数组在箭头函数中并不存在。

const gun = ()=>{
   console.log(arguments) 
}
gun() //arguments not a defined
const arr = [1,2]
const fun = (a,b)=>{
   console.log(a,b) //1 2
}
fun(..arr) //

以下是扩展符的其他使用场景

1、复制数组（浅拷贝）

注意，它不适用于多级数组或带有日期或函数的数组

const arr1 = [1,2,3]
const arr2 = [...arr1]
console.log(arr2) // [1,2,3]

2、合并数组

const arr1 = [1,2,3]
const arr2 = [4,5,6]
const arr3 = [...arr1,...arr2]
console.log(arr3) // [1,2,3,4,5,6]

//合并多个数组
const arr4 = [...arr1,...arr2,...arr3]

3、向对象添加属性

const user = {
  firstname:'Chris',
  lastname: 'Bongers'
}
// 向user对象添加age
const output = {...user,age:31};

4、Math() 函数

const arr1 = [1,-1,0,5,3]
const min = Math.min(...arr1)
const max = Math.max(...arr1)

5、rest参数

const arr1 = [1,2,3]
const myFunc(x1,x2,x3)=>{
    console.log(x1,x2,x3)
}
myFunc(...arr1)  // 1   2   3

myFunc(1, 'a', new Date())

6、向函数传递无限