Paràmetres rest

El paràmetre rest ens permet  representar un nombre indefinit d'arguments en forma d 'array.

Syntax

function f(a, b, ...theArgs) {
  // ...
}

Descripció

Si l'últim argument d'una funció, està prefixat amb l'operador ..., aquest esdevé un array el qual té com a elements des de 0 (inclòs) fins a theArgs.length (no inclòs) els arguments passats a la funció.

A l'exemple de sobre, theArgs aglutina el tercer argument de la funció, ja que el primer està mapejat a a  i el segon està mapejat a b , i tota la resta d'arguments consecutius. 

Diferència entre els paràmetres rest i l'objecte arguments

Existeixen tres diferències principals entre els  paràmetres rest i l'objecte arguments

• Els paràmetres rest són aquells als que no s' ha donat un nom per separat, mentre que l' objecte arguments conté tots els paràmetres passats a la funció
• L' objecte arguments no és un array real, mentre que els paràmetres rest són instàncies d' Array , el qual significa que els hi podem aplicar directamaent els mètodes sort, map, forEach o pop.
• L' objecte arguments té funcionalitat específica a sí mateix (com la propietat calle).

Des d' arguments fins a un array

El paràmetre rest ha estat introduit per tal de reduir la quantitat de codi utilitzat que es introduit per els arguments

// Anteriorment a l' existència del paràmetre rest el s' utilitzava seguent codi
function f(a, b) {
  var args = Array.prototype.slice.call(arguments, f.length);

  // …
}

// equivalent a

function f(a, b, ...args) {
  
}

Desestructurant paràmetres rest

Els paràmetres rest es poden desestructurar, que vol dir que els valors que contenen es poden desenpaquetar en variables diferents i separades. Vegeu Destructuring assignment.

function f(...[a, b, c]) {
  return a + b + c;
}

f(1)          // NaN (bi c són undefined)
f(1, 2, 3)    // 6
f(1, 2, 3, 4) // 6 (el quart paràmetre no està desetructurat)

Exemples

Com que theArgs és un array, la propietat length en retorna el recompte:

function fun1(...theArgs) {
  console.log(theArgs.length);
}

fun1();  // 0
fun1(5); // 1
fun1(5, 6, 7); // 3

En el seguent exemple el paràmetre rest s' utilitza per aglutinar tots els paràmetres passats a la funcció després del primer en un array. Després cadascun d' ells és multiplicat per el primer paràmetre passat a la funció i es retorna l' array.

function multiply(multiplier, ...theArgs) {
  return theArgs.map(function(element) {
    return multiplier * element;
  });
}

var arr = multiply(2, 1, 2, 3); 
console.log(arr); // [2, 4, 6]

El seguent exemple mostra com els mètodes d' Array es poden utilitzar am paràmetres rest, però no amb l' objecte arguments :

function sortRestArgs(...theArgs) {
  var sortedArgs = theArgs.sort();
  return sortedArgs;
}

console.log(sortRestArgs(5, 3, 7, 1)); // mostra 1, 3, 5, 7

function sortArguments() {
  var sortedArgs = arguments.sort(); 
  return sortedArgs; // aquesta línia mai s' executarà
}

// genera el TypeError: arguments.sort no és una funció
console.log(sortArguments(5, 3, 7, 1));

Per tal de poder usar els mètodes d' Array amb l' objecte arguments , aquest s' ha de convertir primer en un array.

function sortArguments() {
  var args = Array.prototype.slice.call(arguments);
  var sortedArgs = args.sort();
  return sortedArgs;
}
console.log(sortArguments(5, 3, 7, 1)); // shows 1, 3, 5, 7

Specifications

Browser compatibility

See also

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