ES6 Rest参数



ES6 Rest参数

ES6 Rest参数

在 ECMAScript 2015 或 ES6 中引入了 rest 参数,这提高了处理参数的能力。 rest 参数允许我们将无限数量的参数表示为一个数组。通过使用 rest 参数,可以使用任意数量的参数调用函数。
在 ES6 之前,使用函数的 arguments 对象。 arguments 对象不是 Array 类型的实例。因此,我们不能直接使用 filter() 方法。
rest 参数以三个点(...) 为前缀。虽然 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 对象的区别

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

arguments 对象是一个类数组(但不是数组),而其余参数是数组实例。参数对象不包括sort、map、forEach、或pop等方法,但这些方法可以直接在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 允许我们使用 function 构造函数创建动态函数。我们可以在动态函数中使用 rest 参数。

示例

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

输出
[ 10, 20, 30 ]