Mit der Rest Parameter Syntax kann man beliebig viele Parameter als Array empfangen.

Syntax

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

Beschreibung

Wenn vor dem letzten Parameter einer Funktion ... steht wird aus diesem Parameter ein Array von 0 (inklusiv) bis zu restArgs.length (exklusiv), welches weitere der Funktion übergebene Parameter enthält.

Im oberen Beispiel enthält das restArgs alle weiteren Argumente außer die ersten beiden, da diese bereits von den Variablen a und b erfasst werden.

Unterschiede zwischen Rest Parametern und dem arguments Objekt

Es gibt drei Hauptunterschiede zwischen Rest Parametern und dem arguments Objekt:

  • Rest Parameter sind nur die jenigen, die zu einem Namen gehören (z. B. in Funktionsausdrücken formal definierte Parameter), während das arguments Objekt alle übergebenen Argumente einer Funktion enthällt.
  • Das arguments Objekt ist kein echtes Array, während Rest Parameter eine Array sind, was bedeutet, dass Methoden wie sort, map, forEach oder pop direkt angewendet werden können.
  • Das arguments Objekt hat zusätzliche, spezielle Funktionalität (wie die callee Eigenschaft).

Von arguments zu einem Array

Rest Parameter wurden eingeführt, um Standardcode zu reduzieren, welche beim Einsatz von arguments anfällt

// Before rest parameters, the following could be found:
function f(a, b) {
  var args = Array.prototype.slice.call(arguments, f.length);

  // …
}

// to be equivalent of

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

Destrukturierte Rest Parameter

Rest Parameter können destrukturiert werden, was bedeutet, dass sie in einzelne Variablen entpackt werden können. Siehe destrukturierende Zuweisung.

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)

Beispiele

Weil theArgs ein Array ist, ist die Anzahl der Argumente mit der length Eigenschaft gegeben:

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

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

Im nächsten Beispiel wird ein Rest Parameter eingesetzt, um alle Argumente außer dem ersten in einem Array zu sammeln. Jedes wird dann mit dem ersten Argument multipliziert und als Array zurückgegeben:

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]

Das folgende Beispiel zeigt, dass Array Methoden auf Rest Parameter jedoch nicht auf arguments Objekten eingesetzt werden können:

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

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

function sortArguments() {
  var sortedArgs = arguments.sort(); 
  return sortedArgs; // this will never happen
}

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

Um Array Methoden auf einem arguments Objekt zu benutzen, muss dieses in ein echtes Array konvertiert werden.

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

Spezifikationen

Spezifikation Status Kommentar
ECMAScript 2015 (6th Edition, ECMA-262)
Die Definition von 'Function Definitions' in dieser Spezifikation.
Standard Initiale Definition
ECMAScript Latest Draft (ECMA-262)
Die Definition von 'Function Definitions' in dieser Spezifikation.
Entwurf  

Browserkompatibilität

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidiOS SafariSamsung InternetNode.js
Grundlegende UnterstützungChrome Vollständige Unterstützung 47Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 15IE Keine Unterstützung NeinOpera Vollständige Unterstützung 34Safari Vollständige Unterstützung 10WebView Android Vollständige Unterstützung 47Chrome Android Vollständige Unterstützung 47Edge Mobile Vollständige Unterstützung 12Firefox Android Vollständige Unterstützung 15Opera Android Vollständige Unterstützung 34Safari iOS Vollständige Unterstützung 10Samsung Internet Android Vollständige Unterstützung 5.0nodejs Vollständige Unterstützung 6.0.0
Vollständige Unterstützung 6.0.0
Vollständige Unterstützung 4.0.0
Deaktiviert
Deaktiviert From version 4.0.0: this feature is behind the --harmony runtime flag.
Destructuring rest parametersChrome Vollständige Unterstützung 49Edge Keine Unterstützung NeinFirefox Vollständige Unterstützung 52IE Keine Unterstützung NeinOpera Vollständige Unterstützung 36Safari ? WebView Android Vollständige Unterstützung 49Chrome Android Vollständige Unterstützung 49Edge Mobile Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 52Opera Android Vollständige Unterstützung 36Safari iOS ? Samsung Internet Android Vollständige Unterstützung 5.0nodejs Vollständige Unterstützung Ja

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Kompatibilität unbekannt  
Kompatibilität unbekannt
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: sonicdoe, schlagi123, Simmarith
Zuletzt aktualisiert von: sonicdoe,