Rest parameters

De rest parameter syntax laat ons toe om een onbepaald aantal argumenten te vertegenwoordigen als een array.

Syntax

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

Beschrijving

Als het laatst genoemd argument van een functie wordt voorafgegaan door ..., dan wordt dit een array waarvan de elementen van 0 tot theArgs.length worden doorgegeven als eigenlijke argumenten aan de functie.

In het bovestaande voorbeeld, verzameld theArgs als derde argument van de functie. Alle opeenvolgnde argumenten die na a en b zijn toegevoegd in de argumenten lijst.

Verschillen tussen de rest parameter en het arguments object

Er zijn drie belangrijke verschillen tussen de rest parameters en het arguments object:

  • rest parameters zijn alleen de argumenten die niet via een andre naam aan de functie zijn doorgegeven, terwijl het arguments object wel alle argumenten bevat die zijn doorgegeven.
  • het arguments object is niet echt een array, terwijl de rest parameters wel een instancie van een Array zijn, waardoor je methodes zoals sort, map, forEach en pop rechtstreeks kan gebruiken.
  • de argumenten object heeft extra functionaliteit specifiek voor zichzelf  (zoals de callee property).

Van arguments tot een array

Rest parameters zijn ingevoerd om de standaardcode die werd veroorzaakt door het arguments object te verminderen.

// Voor rest parameters, kwam je het volgende wel eens tegen:
function f(a, b){
  var args = Array.prototype.slice.call(arguments, f.length);

  // …
}

// Wat net hetzelfde is als:

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

Voorbeelden

Aangezien theArgs een array is, kunt u de telling van de elementen verkrijgen met het behulp van de eigenschap .length:

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

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

In het volgende voorbeeld, gebruiken we de rest parameter voor het verzamelen vanaf het tweede argument tot het einde. We vermenigvuldigen deze vervolgens met de eerste:

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]

Het volgende voorbeeld toont aan dat je Array methodes kan gebruiken op rest parameters maar niet op het arguments object:

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

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

function sortArguments() {
  var sortedArgs = arguments.sort(); 
  return sortedArgs; // dit zal nooit gebeuren
}

// gooit een TypeError: arguments.sort is not a function
console.log(sortArguments(5,3,7,1));

Om Array methodes op het arguments object te gebruiken, moet je het eerst converteren naar een echte array.

Specificatie

Specification Status Comment
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Function Definitions' in that specification.
Standard Initial definition.
ECMAScript 2016 Draft (7th Edition, ECMA-262)
The definition of 'Function Definitions' in that specification.
Draft  

Browser compatibiliteit

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support 47 (Yes) 15.0 (15.0) Not supported 34 Not supported
Feature Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support Not supported 47 15.0 (15.0) Not supported Not supported Not supported 47

Bekijk ook

Documentlabels en -medewerkers

 Aan deze pagina hebben bijgedragen: DDaems
 Laatst bijgewerkt door: DDaems,