剩余参数语法允许我们将一个不定数量的参数表示为一个数组。

function sum(...theArgs) {
return theArgs.reduce((previous, current) => {
return previous + current;
});
} console.log(sum(1, 2, 3));
// expected output: 6 console.log(sum(1, 2, 3, 4));
// expected output: 10

语法

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

  

描述

如果函数的最后一个命名参数以...为前缀,则它将成为一个数组,其中从0(包括)到theArgs.length(排除)的元素由传递给函数的实际参数提供。

在上面的例子中,theArgs将收集该函数的第三个参数(因为第一个参数被映射到a,而第二个参数映射到b)和所有后续参数。

剩余参数和 arguments对象的区别

剩余参数和 arguments对象之间的区别主要有三个:

  • 剩余参数只包含那些没有对应形参的实参,而 arguments 对象包含了传给函数的所有实参。
  • arguments对象不是一个真正的数组,而剩余参数是真正的 Array实例,也就是说你能够在它上面直接使用所有的数组方法,比如 sortmapforEachpop
  • arguments对象还有一些附加的属性 (如callee属性)。

从 arguments 到数组

引入了剩余参数来减少由参数引起的样板代码。

// Before rest parameters, the following could be found:
function f(a, b) {
var args = Array.prototype.slice.call(arguments, f.length); // …
} // to be equivalent of function f(a, b, ...args) { }

解构剩余参数

剩余参数可以被解构,这意味着他们的数据可以被解包到不同的变量中。请参阅解构赋值

function f(...[a, b, c]) {
return a + b + c;
} f(1) // NaN (b and c are undefined)
f(1, 2, 3) // 6
f(1, 2, 3, 4) // 6 (the fourth parameter is not destructured)

  

示例

因为theArgs是个数组,所以你可以使用length属性得到剩余参数的个数:

function fun1(...theArgs) {
alert(theArgs.length);
} fun1(); // 弹出 "0", 因为theArgs没有元素
fun1(5); // 弹出 "1", 因为theArgs只有一个元素
fun1(5, 6, 7); // 弹出 "3", 因为theArgs有三个元素

  

下例中,剩余参数包含了从第二个到最后的所有实参,然后用第一个实参依次乘以它们:

function multiply(multiplier, ...theArgs) {
return theArgs.map(function (element) {
return multiplier * element;
});
} var arr = multiply(2, 1, 2, 3);
console.log(arr); // [2, 4, 6]

  

下例演示了你可以在剩余参数上使用任意的数组方法,而arguments对象不可以:

function sortRestArgs(...theArgs) {
var sortedArgs = theArgs.sort();
return sortedArgs;
} alert(sortRestArgs(5,3,7,1)); // 弹出 1,3,5,7 function sortArguments() {
var sortedArgs = arguments.sort();
return sortedArgs; // 不会执行到这里
} alert(sortArguments(5,3,7,1)); // 抛出TypeError异常:arguments.sort is not a function

  

为了在arguments对象上使用Array方法,它必须首先被转换为一个真正的数组。

function sortArguments() {
var args = Array.prototype.slice.call(arguments);
var sortedArgs = args.sort();
return sortedArgs;
}
console.log(sortArguments(5, 3, 7, 1)); // shows 1, 3, 5, 7

 

 

...args剩余参数用法的更多相关文章

  1. ES6新增语法和内置对象(let,const, Array/String/Set 扩展方法(解构赋值,箭头函数,剩余参数))

    1.let ES6中新增的用于声明变量的关键字. let 声明的变量只在所处于的块级有效. 注意:使用 let 关键字声明的变量才具有块级作用域,var 关键字是不具备这个特点的. 1. 防止循环变量 ...

  2. ES6躬行记(2)——扩展运算符和剩余参数

    扩展运算符(Spread Operator)和剩余参数(Rest Parameter)的写法相同,都是在变量或字面量之前加三个点(...),并且只能用于包含Symbol.iterator属性的可迭代对 ...

  3. 【Python基础】*args,**args的详细用法

     Python基础知识:*args,**args的详细用法 参考:https://blog.csdn.net/qq_29287973/article/details/78040291 *args 不定 ...

  4. 使用剩余参数代替 arguments (prefer-rest-params)

    使用剩余参数代替 arguments (prefer-rest-params) 剩余参数来自于ES2016.可以在可变函数中使用这个特性来替代arguments变量. arguments没有Array ...

  5. ES6函数剩余参数(Rest Parameters)

    我们知道JS函数内部有个arguments对象,可以拿到全部实参.现在ES6给我们带来了一个新的对象,可以拿到除开始参数外的参数,即剩余参数(废话好多 O(∩_∩)O~). 这个新的对象和argume ...

  6. DAX/PowerBI系列 - 查询参数用法详解(Query Parameter)

    PowerBI  - 查询参数用法详解(Query Parameter) 很多人都不知道查询参数用来干啥,下面总结一下日常项目中常用的几个查询参数的地方.(本人不太欢hardcode的东西) 使用查询 ...

  7. Python *args 和 **kwargs用法

    *args的参数形式把剩下的没有关键字的参数收起来形成一个tuple,*kwargs把有关键字的收起来做成一个字典 def this_fun(a,b,*args,**kwargs): print a ...

  8. ES6学习--函数剩余参数 (rest参数)

    ES6 引入 rest 参数(形式为“...变量名”),用于获取函数的多余参数,这样就不需要使用arguments对象了.rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中.(可以拿到除 ...

  9. nodejs 不支持 typescript (...paramName:any[])剩余参数。变相支持方式。

    node es6 变相实现支持ts的剩余参数实现方式 //.ts method assign(to: any, options?: AssignOptions, ...forms: any[]){} ...

随机推荐

  1. nuget程序包还原失败:未能解析此远程名称

    一个简便的方法就是取消下载缺少的程序包. 步骤如下: 1,工具--NuGet程序包管理器--程序包管理器设置 2,NuGet Package Manager--常规,取消勾选.

  2. 利用JavaScriptSerializer类 进行Json对象的序列化和反序列化和过滤

    项目下载:JavaScriptSerializer_对JSON对象序列化与反序列化及过滤器 利用<JavascriptSerializer类> 进行Json对象的序列化和反序列化 1. 首 ...

  3. tcp中的发送窗口是啥意思?

    初始的三次握手: 02:52:36.585412 IP 127.0.0.1.59764 > 127.0.0.1.8000: Flags [S], seq 3800457532, win 4369 ...

  4. bpf程序

    bpf都是怎么起作用的? 记得bpf之前是绑定在bpf bpf作用在哪里呀?

  5. [计算机网络-应用层] DNS:因特网的目录服务

    我们知道有两种方式可以识别主机:通过主机名或者IP地址.人们喜欢便于记忆的主机名标识,而路由器则喜欢定长的.有着层次结构的IP地址.为了折中这些不同的偏好,我们需要一种能进行主机名到IP地址转换的目录 ...

  6. Java的第一个程序-Hello, World !

    学了一个月的Java,现在总结一下,就算复习了. 一.安装Java环境 这个没啥好说的. 1. 官网下载JDK安装 2. 配置环境变量.注意的是:环境变量配置好以后,如果cmd中运行 java 命令没 ...

  7. [洛谷P4312][COCI 2009] OTOCI / 极地旅行社

    题目大意:有$n(n\leqslant3\times10^4)$个点,每个点有点权,$m(m\leqslant3\times10^5)$个操作,操作分三种: $bridge\;x\;y:$询问节点$x ...

  8. [洛谷P2463][SDOI2008]Sandy的卡片

    题目大意:有$n$个字符串,求这$n$个字符串中最长的相似公共字串,相似的定义是加上一个数后相同 题解:差分,建广义后缀自动机,然后求出每个点在多少个字符串中出现过,若在$n$个中都出现,就更新答案 ...

  9. [Leetcode] Construct binary tree from inorder and postorder travesal 利用中序和后续遍历构造二叉树

    Given inorder and postorder traversal of a tree, construct the binary tree. Note:  You may assume th ...

  10. thread-wait/sleep

    对于sleep()方法,我们首先要知道该方法是属于Thread类中的.而wait()方法,则是属于Object类中的. sleep()方法导致了程序暂停执行指定的时间,让出cpu该其他线程,但是他的监 ...