这里有新鲜出炉的精品教程,程序狗速度看过来!
ECMAScript 6 (ECMAScript 2015)编码规范
这篇文章主要介绍了 ECMAScript6 函数剩余参数(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.phperz.com/article/17/0714/270912.html