...扩展运算符的妙用

一、普通用法

const arr1 = [1, 2, 3, 4]
const arr2 = [5, 6, 7, 8]
const newArr = [...arr1, ...arr2]

二、当它被用在函数形参上时，它还可以把一个分离的参数序列整合成一个数组

function mutiple(...args) {
  let result = 1;
  for (var val of args) {
    result *= val;
  }
  return result;
}

mutiple(1, 2, 3, 4) // 24

在这个例子里，我们传入 mutiple 的是四个分离的参数，但是如果你在 mutiple 函数里尝试输出 args 的值，你会发现它是一个数

function mutiple(...args) {
  console.log(args)
}

mutiple(1, 2, 3, 4) // [1, 2, 3, 4]

三、用于类数组的转换

三种转换方法：

const arr = Array.prototype.slice.call(arrayLike)

const arr = Array.from(arrayLike)

扩展运算符——"…"也可以把类数组对象转换为数组，前提是这个类数组对象上部署了遍历器接口。在这个例子中，arrayLike 没有部署遍历器接口，所以这条路走不通。但一些对象，比如函数内部的 arguments 变量（它也是类数组对象），就满足条件，可以用这种方法来转换

function demo() {
  console.log('转换后的 arguments 对象：', [...arguments])
} 

demo(1, 2, 3, 4) // 转换后的 arguments 对象：[1, 2, 3, 4]