📜  ES6剩余参数

📅  最后修改于: 2021-01-01 03:48:30             🧑  作者: Mango

ES6其余参数

rest参数在ECMAScript 2015或ES6中引入,从而提高了处理参数的能力。 rest参数允许我们将无限数量的参数表示为数组。通过使用其他参数,函数可与任意数量的参数调用。

在ES6之前,使用了函数的arguments对象。 arguments对象不是Array类型的实例。因此,我们不能直接使用filter()方法。

rest参数以三个点(…)为前缀。虽然其余参数的语法是类似于传播运算符,它是从扩频运算符完全相反。 rest参数必须是最后一个参数,因为它用于将所有剩余元素收集到一个数组中。

句法

function fun(a, b, ...theArgs) {
  // statements
}

function show(...args) {
  let sum = 0;
  for (let i of args) {
      sum += i;
  }
  console.log("Sum = "+sum);
}

show(10, 20, 30);

输出量

Sum = 60

我们在函数传递的所有参数都将映射到参数列表。如上所述,rest参数(…)应该始终位于参数列表的最后。如果将其放置在其他任何地方,将导致错误。

具有以下语法的rest参数将导致错误。

function show(a,...rest, b) {
  // error
 };

Rest Parameter和arguments对象之间的区别

rest参数arguments对象彼此不同。让我们看看rest参数和arguments对象之间的区别:

  • arguments对象是类似数组的对象(但不是array),而其余参数是数组实例。 arguments对象不包含诸如sort,map,forEachpop之类的方法,但是这些方法可以直接用于rest参数中。

休息参数和解构

重构意味着将复杂的结构分解为更简单的部分。我们可以将数组定义为rest参数。传入的参数将分解为数组。 Rest参数仅支持数组解构。

通过使用rest参数,我们可以将数组的所有剩余元素放入新数组中。

让我们看一下相同的例子。

var colors = ["Violet", "Indigo", "Blue", "Green", "Yellow", "Orange", "Red"];  
  
// destructuring assignment  
var [a,b,...args] = colors;  
console.log(a);   
console.log(b);   
console.log(args);

输出量

Violet
Indigo
[ 'Blue', 'Green', 'Yellow', 'Orange', 'Red' ]

动态函数的剩余参数

JavaScript允许我们使用函数构造函数创建动态函数。我们可以在动态函数使用rest参数。

let num = new Function('...args','return args');
console.log(num(10, 20, 30));

输出量

[ 10, 20, 30 ]