Parâmetros Rest

A sintaxe do parâmetro "rest" permite-nos representar um número indefinido de argumentoscomo um array.

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) {
  // ...
}

A function's last parameter can be prefixed with ... which will cause all remaining (user supplied) arguments to be placed within a "standard" Javascript array.

Only the last parameter can be a "rest parameter".

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]

There are three main differences between rest parameters and the arguments object:

• rest parameters are only the ones that haven't been given a separate name (i.e. formally defined in function expression), while the arguments object contains all arguments passed to the function;
• the 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;
• the 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
}

Rest parameters can be destructured Arrays only (though objects will soon be supported). That means that their data can be unpacked into distinct variables. (See Destructuring assignment.)

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)

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 ...)

In this example, the first argument is mapped to a and the second to b, so these named arguments are used like 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 property:

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(function(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 object:

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)

To use Array methods on the arguments object, it must be converted to a real array first.

function sortArguments() {
  let args = Array.from(arguments)
  let sortedArgs = args.sort()
  return sortedArgs
}
console.log(sortArguments(5, 3, 7, 1))  // 1, 3, 5, 7

• Spread syntax (also ‘...’)
• Arguments object
• Array
• Functions
• Original proposal at ecmascript.org
• JavaScript arguments object and beyond
• Destructuring assignment