其余参数 句法允许将不定数目的自变量表示成数组。
The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
function f(a, b, ...theArgs) {
// ...
}
函数的最后参数可以加前缀采用
...
which will cause all remaining (user supplied) arguments to be placed within a "standard" JavaScript array.
仅最后参数可以是其余参数。
function myFun(a, b, ...manyMoreArgs) {
console.log("a", a)
console.log("b", b)
console.log("manyMoreArgs", manyMoreArgs)
}
myFun("one", "two", "three", "four", "five", "six")
// Console Output:
// a, one
// b, two
// manyMoreArgs, [three, four, five, six]
arguments
object
有 3 个主要区别介于其余参数和
arguments
对象：
arguments
object contains
all
arguments passed to the function;
arguments
object is not a real array, while rest parameters are
Array
instances, meaning methods like
sort
,
map
,
forEach
or
pop
can be applied on it directly;
arguments
object has additional functionality specific to itself (like the
callee
property).
Rest parameters have been introduced to reduce the boilerplate code that was induced by the arguments
// Before rest parameters, "arguments" could be converted to a normal array using:
function f(a, b) {
let normalArray = Array.prototype.slice.call(arguments)
// -- or --
let normalArray = [].slice.call(arguments)
// -- or --
let normalArray = Array.from(arguments)
let first = normalArray.shift() // OK, gives the first argument
let first = arguments.shift() // ERROR (arguments is not a normal array)
}
// Now, you can easily gain access to a normal array using a rest parameter
function f(...args) {
let normalArray = args
let first = normalArray.shift() // OK, gives the first argument
}
In this example, the first argument is mapped to
a
and the second to
b
, so these named arguments are used as normal.
However, the third argument,
manyMoreArgs
, will be an array that contains the 3
rd
, 4
th
, 5
th
, 6
th
...
n
th
— as many arguments that the user includes.
function myFun(a, b, ...manyMoreArgs) {
console.log("a", a)
console.log("b", b)
console.log("manyMoreArgs", manyMoreArgs)
}
myFun("one", "two", "three", "four", "five", "six")
// a, one
// b, two
// manyMoreArgs, [three, four, five, six]
Below... even though there is just one value, the last argument still gets put into an array.
// using the same function definition from example above
myFun("one", "two", "three")
// a, one
// b, two
// manyMoreArgs, [three]
Below, the third argument isn't provided, but
manyMoreArgs
is still an array (albeit an empty one).
// using the same function definition from example above
myFun("one", "two")
// a, one
// b, two
// manyMoreArgs, []
Since
theArgs
is an array, a count of its elements is given by the
length
特性：
function fun1(...theArgs) {
console.log(theArgs.length)
}
fun1() // 0
fun1(5) // 1
fun1(5, 6, 7) // 3
In the next example, a rest parameter is used to collect all parameters after the first into an array. Each one of them is then multiplied by the first parameter, and the array is returned:
function multiply(multiplier, ...theArgs) {
return theArgs.map(element => {
return multiplier * element
})
}
let arr = multiply(2, 1, 2, 3)
console.log(arr) // [2, 4, 6]
Array
methods can be used on rest parameters, but not on the
arguments
对象：
function sortRestArgs(...theArgs) {
let sortedArgs = theArgs.sort()
return sortedArgs
}
console.log(sortRestArgs(5, 3, 7, 1)) // 1, 3, 5, 7
function sortArguments() {
let sortedArgs = arguments.sort()
return sortedArgs // this will never happen
}
console.log(sortArguments(5, 3, 7, 1))
// throws a TypeError (arguments.sort is not a function)
要使用
Array
方法在
arguments
对象，必须把它先转换为真正的数组。
function sortArguments() {
let args = Array.from(arguments)
let sortedArgs = args.sort()
return sortedArgs
}
console.log(sortArguments(5, 3, 7, 1)) // 1, 3, 5, 7
| 规范 |
|---|
|
ECMAScript (ECMA-262)
The definition of 'Function Definitions' in that specification. |
| Desktop | Mobile | Server | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 其余参数 | Chrome 47 | Edge 12 | Firefox 15 | IE No | Opera 34 | Safari 10 | WebView Android 47 | Chrome Android 47 | Firefox Android 15 | Opera Android 34 | Safari iOS 10 | Samsung Internet Android 5.0 |
nodejs
6.0.0
|
| 析构其余参数 | Chrome 49 | Edge 79 | Firefox 52 | IE No | Opera 36 | Safari 10 | WebView Android 49 | Chrome Android 49 | Firefox Android 52 | Opera Android 36 | Safari iOS 10 | Samsung Internet Android 5.0 | nodejs Yes |
完整支持
不支持
用户必须明确启用此特征。
...
’)