ECMAScript6函数剩余参数(Rest Parameters)


Posted in Javascript onJune 12, 2015

我们知道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,前面有三个点。定义好后调用了两次,结果分别如下

ECMAScript6函数剩余参数(Rest Parameters)

可以看到第一次调用时,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)

输出结果如下

ECMAScript6函数剩余参数(Rest Parameters)

通过以上两个示例应该已经了解剩余参数的意义了吧。

剩余参数嘛,所以后面就不要再跟其它的参数了,不然会报错

function func(a, ...rest, b) {
 
}

这里在rest后面加了一个参数b,Firefox会报错

ECMAScript6函数剩余参数(Rest Parameters)

当您使用剩余参数后,函数的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控制台如下

ECMAScript6函数剩余参数(Rest Parameters)

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
}

以上所述就是本文的全部内容了,希望大家能喜欢。

Javascript 相关文章推荐
JavaScript操作XML 使用百度RSS作为新闻源示例
Feb 17 Javascript
根据选择不同的下拉值出现相对应的文本输入框
Aug 01 Javascript
Js与下拉列表处理问题解决
Feb 13 Javascript
javascript实现动态导入js与css等静态资源文件的方法
Jul 25 Javascript
jquery实现可点击伸缩与展开的菜单效果代码
Aug 31 Javascript
BootStrap Validator使用注意事项(必看篇)
Sep 28 Javascript
js实现Tab选项卡切换效果
Jul 17 Javascript
vue webpack打包优化操作技巧
Feb 22 Javascript
vue实现在表格里,取每行的id的方法
Mar 09 Javascript
在Vue-cli里应用Vuex的state和mutations方法
Sep 16 Javascript
2019最新21个MySQL高频面试题介绍
Feb 06 Javascript
vue实现图书管理系统
Dec 29 Vue.js
ECMAScript6函数默认参数
Jun 12 #Javascript
在JavaScript中操作时间之setYear()方法的使用
Jun 12 #Javascript
简介JavaScript中setUTCSeconds()方法的使用
Jun 12 #Javascript
JS中产生标识符方式的演变
Jun 12 #Javascript
JS中处理时间之setUTCMinutes()方法的使用
Jun 12 #Javascript
JavaScript中setUTCMilliseconds()方法的使用详解
Jun 12 #Javascript
JavaScript中setUTCFullYear()方法的使用简介
Jun 12 #Javascript
You might like
PHP小程序自动提交到自助友情连接
2009/11/24 PHP
[原创]smarty简单模板变量输出方法
2016/07/09 PHP
yii2中dropDownList实现二级和三级联动写法
2017/04/26 PHP
PHP之多条件混合筛选功能的实现方法
2019/10/09 PHP
聊聊 PHP 8 新特性 Attributes
2020/08/19 PHP
JavaScript 闭包在封装函数时的简单分析
2009/11/28 Javascript
jQuery实现预加载图片的方法
2015/03/17 Javascript
JavaScript字符串常用类使用方法汇总
2015/04/14 Javascript
jquery+css实现的红色线条横向二级菜单效果
2015/08/22 Javascript
jQuery轻松实现表格的隔行变色和点击行变色的实例代码
2016/05/09 Javascript
AngularJs中Bootstrap3 datetimepicker使用实例
2016/12/13 Javascript
JavaScript html5利用FileReader实现上传功能
2020/03/27 Javascript
Vue.js实现移动端短信验证码功能
2017/03/29 Javascript
vue实现长图垂直居上 vue实现短图垂直居中
2017/10/18 Javascript
Angular4学习笔记router的简单使用
2018/03/30 Javascript
angular的输入和输出的使用方法
2018/09/22 Javascript
Vue项目history模式下微信分享爬坑总结
2019/03/29 Javascript
js中实现继承的五种方法
2021/01/25 Javascript
[01:15:12]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#4Newbee VS CDEC
2016/03/03 DOTA
python控制台显示时钟的示例
2014/02/24 Python
用Python创建声明性迷你语言的教程
2015/04/13 Python
python对url格式解析的方法
2015/05/13 Python
Python模块包中__init__.py文件功能分析
2016/06/14 Python
详细解读tornado协程(coroutine)原理
2018/01/15 Python
浅谈Python3中strip()、lstrip()、rstrip()用法详解
2019/04/29 Python
python requests库爬取豆瓣电视剧数据并保存到本地详解
2019/08/10 Python
Jupyter加载文件的实现方法
2020/04/14 Python
python函数中将变量名转换成字符串实例
2020/05/11 Python
Python参数传递对象的引用原理解析
2020/05/22 Python
欧洲第一中国智能手机和平板电脑网上商店:CECT-SHOP
2018/01/08 全球购物
最畅销的视频游戏享受高达90%的折扣:CDKeys
2020/02/10 全球购物
饭店工作计划书
2014/01/10 职场文书
施工安全责任书范本
2014/07/24 职场文书
作风建设年活动实施方案
2014/10/24 职场文书
行政主管岗位职责
2015/02/03 职场文书
win10搭建配置ftp服务器的方法
2022/08/05 Servers