ES6函数剩余参数(Rest Parameters)
我们知道JS函数内部有个arguments对象,可以拿到全部实参。现在ES6给我们带来了一个新的对象,可以拿到除开始参数外的参数,即剩余参数(废话好多 O(∩_∩)O~)。
这个新的对象和arguments不一样,它是程序员自定义的一个普通标识符,只是需要在前面加上三个点:...
function func(a, ...rest) {
console.log(a)
console.log(rest)
}
func(1)
func(1, 2, 3, 4)
注意func的第二个参数rest,前面有三个点。定义好后调用了两次,结果分别如下

可以看到第一次调用时,rest为一个空数组,第二次为[2, 3, 4]。
又比如,在前面定义2个参数
function func(a, b, ...rest) {
console.log(a, b)
console.log(rest)
}
func(1, 2)
func(1, 2, 3, 4)
输出结果如下

通过以上两个示例应该已经了解剩余参数的意义了吧。
剩余参数嘛,所以后面就不要再跟其它的参数了,不然会报错
function func(a, ...rest, b) {
}
这里在rest后面加了一个参数b,Firefox会报错

当您使用剩余参数后,函数的length属性会发生一些变化
function func(a, b, ...rest) {
}
func.length // 2
即length不包含rest,为2。
有同学会想,剩余参数前面是否可以一个参数都没有呢? 答案是肯定的
function func(...rest) {
console.log(rest)
}
func(1) // [1]
func(1, 2, 3, 4) // [1,2,3,4]
这里的rest实际和arguments功能差不多,有同学想这不就替代了arguments吗? ECMAScript就是这个打算,在被废弃的ES4里就已经有Rest Parameters(熟悉AS3的同学应该了解),ES4被废弃后,Rest Parameters被保留到了ES6。
请注意,rest不能和arguments一起使用,会报错
function func(...rest) {
console.log(rest)
console.log(arguments)
}
Firefox控制台如下

arguments和剩余参数的区别
- arguments是一个伪数组(Array-like)
- 剩余参数是一个真正数组(Array),具有Array.prototype上的所有方法
- arguments上有callee,callee上有caller
如
function func(a, ...rest) {
console.log(rest instanceof Array)
}
func(1, 2) // true
最后我们以一个剩余参数实际应用作为结束
/*
* 任意个数相加
*
* **示例**
* sum(1)
* sum(1, 2)
* sum(1, 2, 3)
*/
function sum(first, ...rest) {
var result = first
var i = 0
var len = rest.length
while (i < len) {
result += rest[i]
i++
}
return result
}
相关:
http://www.cnblogs.com/snandy/archive/2011/03/21/1989743.html
ES6函数剩余参数(Rest Parameters)的更多相关文章
- ES6学习--函数剩余参数 (rest参数)
ES6 引入 rest 参数(形式为“...变量名”),用于获取函数的多余参数,这样就不需要使用arguments对象了.rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中.(可以拿到除 ...
- ES6函数默认参数(Default Parameters)
语言更新时每一个新增的特性都是从千百万开发者需求里提取过来的,规范采用后能减少程序员的痛苦,带来便捷. 我们经常会这么写 function calc(x, y) { x = x || 0; y = y ...
- Angular2入门:TypeScript的函数 - 剩余参数和箭头函数
- ES6新增语法(二)——函数和参数
箭头函数 箭头函数:将原来函数的function关键字和函数名都删掉,并使用"=>"连接参数列表和函数体. 箭头函数语法: (参数1,参数2)=>{ 函数体 } 注意点 ...
- ES6新增语法和内置对象(let,const, Array/String/Set 扩展方法(解构赋值,箭头函数,剩余参数))
1.let ES6中新增的用于声明变量的关键字. let 声明的变量只在所处于的块级有效. 注意:使用 let 关键字声明的变量才具有块级作用域,var 关键字是不具备这个特点的. 1. 防止循环变量 ...
- es6笔记 day2---函数默认参数、箭头函数、剩余参数
函数变化: 1.函数默认参数 2.函数参数默认是已经定义了,不能再使用let.const声明 3.扩展运算符.rest运算符 ...就是扩展运算符,它的作用就是把数组给展开 结合函数使用传参,也可以将 ...
- [ES6系列-03]ES6中关于参数相关特性详解(参数默认值与参数解构赋值与剩余参数)
[原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 今天总结一下 ES6 中跟参数相关的内容. 欢迎补充斧正.留言交流. 让我们互相学习一起进步. 1. ES6 参数默认值( ...
- ES6躬行记(2)——扩展运算符和剩余参数
扩展运算符(Spread Operator)和剩余参数(Rest Parameter)的写法相同,都是在变量或字面量之前加三个点(...),并且只能用于包含Symbol.iterator属性的可迭代对 ...
- ES6参数默认值,剩余参数及展开数组
一.函数的参数默认值 在ES6之前,想要给参数设置默认值得话,只能在函数体内部加判断设置,比如如果传递参数为undefined时为true, 否则为false,如下图example1,ES6出现语法可 ...
随机推荐
- 【FOL】第六周
最近太忙,三周(第四.五.六周)一起记录一下. 1.完成了键盘的输入,顺便把之前鼠标输入改了一下(最早是在渲染循环里面处理鼠标事件) 2.UI控件方面,做了个Edit控件,把之前的Label.Imag ...
- Mac 连接阿里云服务器
1. 通过命令行连接 Server 并设置 1.1 连接 Server #: ssh root@hctec.top ssh: 远程连接工具 root: 远程服务器用户名, 此处我用的是: root 用 ...
- 设计一个较好的框架的难点之一--API兼容性的设计
设计一个好的框架和设计一个好的软件一样,需要考虑的方面很多,比如扩展性.性能.用户体验.稳健性等等,视不同的场景,每个点都可能导致成败,但他们通常并不是老板们关心的,因为在大部分情况下,他们通常都没有 ...
- Could not publish to the server. java.lang.NullPointerException
右键单击tomcat服务器,找到Properties,点下switch location就好了.
- Sharepoint2013:在页面上显示错误信息
在sharepoint2013中我们需要修改以下三处的web.config,以显示错误信息 1, C:\inetpub\wwwroot\wss\VirtualDirectories\端口号\web.c ...
- 【小贴士】zepto find元素以及ios弹出键盘可能让你很头疼
前言 在此,我不得不说移动端的兼容问题很多,并且很令人头疼,这不,这个星期又有两个让我逮着了,一个是使用zepto过程中出现的问题,一个是ios虚拟键盘的问题 我这里做一次记录,以免以后忘了,同时希望 ...
- angular源码分析:angular中的依赖注入式如何实现的
一.准备 angular的源码一份,我这里使用的是v1.4.7.源码的获取,请参考我另一篇博文:angular源码分析:angular源代码的获取与编译环境安装 二.什么是依赖注入 据我所知,依赖注入 ...
- RSuite 一个基于 React.js 的 Web 组件库
RSuite http://rsuite.github.io RSuite 是一个基于 React.js 开发的 Web 组件库,参考 Bootstrap 设计,提供其中常用组件,支持响应式布局. 我 ...
- Eclipse开发STM32出现找不到函数的情况的解决方法
问题表现: 在明明引用了头文件的情况下,出现“undefined reference to `…'”的情况,例如下图: 解决方法: 在左边的数据目录定位到“system\src\stm32f0-st ...
- CXF:通过WebService上传文件,包括大文件的处理
参考网上文章,用CXF发布上传文件接口,并上传大文件的测试. 框架:spring3.1+cxf2.7.6 1.定义文件类实体 import javax.activation.DataHandler; ...