Rest-Parameter
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Die Syntax für Rest-Parameter erlaubt es einer Funktion, eine unbegrenzte Anzahl von Argumenten als Array zu akzeptieren. Dies bietet eine Möglichkeit, variadic functions in JavaScript darzustellen.
Probieren Sie es aus
function sum(...theArgs) {
let total = 0;
for (const arg of theArgs) {
total += arg;
}
return total;
}
console.log(sum(1, 2, 3));
// Expected output: 6
console.log(sum(1, 2, 3, 4));
// Expected output: 10
Syntax
function f(a, b, ...theArgs) {
// …
}
Es gibt einige zusätzliche Syntaxbeschränkungen:
- Eine Funktionsdefinition kann nur einen Rest-Parameter haben.
- Der Rest-Parameter muss der letzte Parameter in der Funktionsdefinition sein.
- Abschließende Kommata sind nach dem Rest-Parameter nicht erlaubt.
- Der Rest-Parameter kann keinen Standardwert haben.
Beschreibung
Der letzte Parameter einer Funktionsdefinition kann mit ...
(drei U+002E FULL STOP-Zeichen) versehen werden, wodurch alle verbleibenden (vom Benutzer übergebenen) Parameter innerhalb eines Array
-Objekts platziert werden.
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"]
Der Rest-Parameter kann mittels Destrukturierung verwendet werden, wodurch es möglich ist, bestimmte Parameterpositionen zu ignorieren.
function ignoreFirst(...[, b, c]) {
return b + c;
}
Folgende Beispiele führen jedoch zu Syntaxfehlern:
function wrong1(...one, ...wrong) {}
function wrong2(...wrong, arg2, arg3) {}
function wrong3(...wrong,) {}
function wrong4(...wrong = []) {}
Der Rest-Parameter wird nicht in die length
-Eigenschaft der Funktion einbezogen.
Der Unterschied zwischen Rest-Parametern und dem arguments-Objekt
Es gibt vier Hauptunterschiede zwischen Rest-Parametern und dem arguments
-Objekt:
- Das
arguments
-Objekt ist kein echtes Array, während Rest-ParameterArray
-Instanzen sind. Methoden wie z. B.sort()
,map()
,forEach()
oderpop()
können direkt darauf angewendet werden. - Das
arguments
-Objekt hat die zusätzliche (veraltete)callee
-Eigenschaft. - In einer nicht-strikten Funktion mit einfachen Parametern synchronisiert das
arguments
-Objekt seine Indizes mit den Werten der Parameter. Das Rest-Parameter-Array aktualisiert seinen Wert jedoch niemals, wenn benannte Parameter neu zugewiesen werden. - Der Rest-Parameter bündelt alle zusätzlichen Parameter in ein einzelnes Array, enthält jedoch keine benannten Argumente, die vorher dem
...restParam
definiert sind. Dasarguments
-Objekt enthält alle Parameter — einschließlich der Parameter im...restParam
-Array — gebündelt in einem array-ähnlichen Objekt.
Beispiele
Verwendete Rest-Parameter
In diesem Beispiel wird das erste Argument a
und das zweite b
zugeordnet, sodass diese benannten Argumente wie gewohnt verwendet werden.
Das dritte Argument, manyMoreArgs
, ist ein Array, das das dritte, vierte, fünfte, sechste, …, n-te – so viele Argumente wie der Benutzer angibt – enthält.
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"] <-- an array
Im folgenden Beispiel, selbst wenn nur ein Wert vorhanden ist, wird das letzte Argument in ein Array eingefügt.
// Using the same function definition from example above
myFun("one", "two", "three");
// a, "one"
// b, "two"
// manyMoreArgs, ["three"] <-- an array with just one value
Im nächsten Beispiel wird das dritte Argument nicht angegeben, aber manyMoreArgs
ist weiterhin ein Array (wenn auch ein leeres).
// Using the same function definition from example above
myFun("one", "two");
// a, "one"
// b, "two"
// manyMoreArgs, [] <-- still an array
Im darunter stehenden Beispiel wird nur ein Argument übergeben, sodass b
den Standardwert undefined
erhält, aber manyMoreArgs
ist weiterhin ein leeres Array.
// Using the same function definition from example above
myFun("one");
// a, "one"
// b, undefined
// manyMoreArgs, [] <-- still an array
Argumentanzahl
Da theArgs
ein Array ist, kann die Anzahl der Elemente über die length
-Eigenschaft ermittelt werden. Wenn der einzige Parameter der Funktion ein Rest-Parameter ist, entspricht restParams.length
dem Wert von arguments.length
.
function fun1(...theArgs) {
console.log(theArgs.length);
}
fun1(); // 0
fun1(5); // 1
fun1(5, 6, 7); // 3
Nutzung von Rest-Parametern in Kombination mit normalen Parametern
Im nächsten Beispiel wird ein Rest-Parameter verwendet, um alle Parameter nach dem ersten Parameter in einem Array zu sammeln. Jeder der in das Array gesammelten Parameterwerte wird dann mit dem ersten Parameter multipliziert, und das Array wird zurückgegeben:
function multiply(multiplier, ...theArgs) {
return theArgs.map((element) => multiplier * element);
}
const arr = multiply(2, 15, 25, 42);
console.log(arr); // [30, 50, 84]
Vom arguments-Objekt zu einem Array
Array
-Methoden können auf Rest-Parameter angewendet werden, jedoch nicht auf das arguments
-Objekt:
function sortRestArgs(...theArgs) {
const sortedArgs = theArgs.sort();
return sortedArgs;
}
console.log(sortRestArgs(5, 3, 7, 1)); // 1, 3, 5, 7
function sortArguments() {
const 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)
Rest-Parameter wurden eingeführt, um den Boilerplate-Code zu reduzieren, der üblicherweise für die Umwandlung einer Menge von Argumenten in ein Array verwendet wurde.
Vor den Rest-Parametern musste arguments
in ein normales Array umgewandelt werden, bevor Array-Methoden darauf angewendet werden konnten:
function fn(a, b) {
const normalArray = Array.prototype.slice.call(arguments);
// — or —
const normalArray2 = [].slice.call(arguments);
// — or —
const normalArrayFrom = Array.from(arguments);
const first = normalArray.shift(); // OK, gives the first argument
const firstBad = arguments.shift(); // ERROR (arguments is not a normal array)
}
Jetzt kann man mithilfe eines Rest-Parameters leicht auf ein normales Array zugreifen:
function fn(...args) {
const normalArray = args;
const first = normalArray.shift(); // OK, gives the first argument
}
Spezifikationen
Specification |
---|
ECMAScript® 2025 Language Specification # sec-function-definitions |
Browser-Kompatibilität
Loading…