Default parameters

Default function parameters (vorgegebene Funktions-Parameter) erlaubt formale Parameter mit vorgegebenen Werten zu initialisieren, sofern ihnen bei einem Funktionsaufruf kein Wert oder undefined zugewiesen wird.

Syntax

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
   statements
}

Beschreibung

In JavaScript haben Funktionsparameter standardmäßig den Default-Wert undefined. Manchmal ist es jedoch sinnvoll einen anderen Default-Wert zu setzen. Hier helfen Default-Parameter weiter.

In der Vergangenheit war die allgemeine Strategie für das Setzen von Default-Werten das Testen von Parameterwerten im Body der Funktion und dem Zuordnen eines Default-Wertes, wenn dieser undefined ist. Wenn in dem folgenden Beispiel bei dem Aufruf kein Wert für b mitgegeben wird, würde der Wert undefined sein. Bei der Auswertung von a*b und dem Aufruf von multiply wird als Rückgabewert NaN zurückgegeben. Im Beispiel wird deshalb dieser Rückgabewert in der zweiten Zeile der Funktion aufgefangen:

function multiply(a, b) {
  b = (typeof b !== 'undefined') ?  b : 1;
  return a * b;
}

multiply(5, 2); // 10
multiply(5, 1); // 5
multiply(5);    // 5

Mit dem Default-Parameter in ES2015 ist die Prüfung im Funktionskörper nicht mehr nötig. Jetzt kann man einfach 1 als den Standardwert für b in dem Funktionskopf definieren: 

function multiply(a, b = 1) {
  return a * b;
}

multiply(5, 2); // 10
multiply(5, 1); // 5
multiply(5);    // 5

Beispiele

Übergeben von undefined

In dem zweiten Aufruf hier, auch wenn das zweite Argument expliziet auf undefined gesetzt ist (jedoch nicht null oder andere Falsy-Werte, ist der Wert des Arguments color beim Aufruf der Default-Wert.

function setBackgroundColor(element, color = 'rosybrown') {
  element.style.backgroundColor = color;
}

setBackgroundColor(someDiv);            // wird gesetzt zu 'rosybrown'
setBackgroundColor(someDiv, undefined); // wird ebenfalls gesetzt zu  'rosybrown'
setBackgroundColor(someDiv, 'blue');    // color wird gesetzt zu'blue' 

Auswerten beim Aufruf

Das Standard-Argument wird zum Zeitpunkt des Aufrufs ausgewertet. Somit wird - anders als z.B. in Python - ein neues Objekt bei jedem Funktionsaufruf erzeugt.

function append(value, array = []) {
  array.push(value);
  return array;
}

append(1); //[1]
append(2); //[2], nicht [1, 2]

Das Gleiche gilt für Funktionen und Variablen:

function callSomething(thing = something()) {
 return thing;
}

function something(){
  return "sth";
}

callSomething();  //sth

Default-Parameter stehen nachfolgenden Default-Parametern zur Verfügung

Die bereits angetroffenen Parameter stehen den späteren Standardparametern zur Verfügung:

function singularAutoPlural(singular, plural = singular+"s", 
                            rallyingCry = plural + " ATTACK!!!") {
  return [singular, plural, rallyingCry ]; 
}

//["Gecko","Geckos", "Geckos ATTACK!!!"]
singularAutoPlural("Gecko");

//["Fox","Foxes", "Foxes ATTACK!!!"]
singularAutoPlural("Fox","Foxes");

//["Deer", "Deer", "Deer ... change."]
singularAutoPlural("Deer", "Deer", "Deer peaceably and respectfully
   petition the government for positive change.")

Diese Funktionalität wird in einer geradlinigen Weise angenähert und zeigt, wie viele Randfälle behandelt werden:

function go() {
  return ":P"
}

function withDefaults(a, b = 5, c = b, d = go(), e = this, 
                      f = arguments, g = this.value) {
  return [a,b,c,d,e,f,g];
}

function withoutDefaults(a, b, c, d, e, f, g){
  switch(arguments.length){
    case 0:
      a
    case 1:
      b = 5
    case 2:
      c = b
    case 3:
      d = go();
    case 4:
      e = this
    case 5:
      f = arguments
    case 6:
      g = this.value;
    default:
  }
  return [a,b,c,d,e,f,g];
}

withDefaults.call({value:"=^_^="});
// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]


withoutDefaults.call({value:"=^_^="});
// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]

Funktionen definiert innerhalb des Funktionskörpers

Eingeführt in Gecko 33 (Firefox 33 / Thunderbird 33 / SeaMonkey 2.30). Funktionen die innerhalb eines Funktionskörper deklariert werden, können nicht von Default-Parametern referenziert werden und führen zu einem ReferenceError. Default-Parameter werden stets zuerst ausgewertet, Funktionsdeklarationen innerhalb von Funktionskörpern erst hinterher.

// Funktioniert nicht! Wirft einen ReferenceError.
function f(a = go()) {
  function go(){return ":P"}
}

Paramater ohne Default nach Default-Parameter

Vor Gecko 26 (Firefox 26 / Thunderbird 26 / SeaMonkey 2.23 / Firefox OS 1.2) erzeugte der folgende Code einen SyntaxError. Dieses wurde in Bug 777060 behoben und funktioniert wie erwartet in späteren Versionen. Bei Aufruf werden Parameter noch immer von links nach rechts angegeben. Default-Parameter werden überschrieben, auch wenn spätere Parameter keinen Default haben:

function f(x=1, y) { 
  return [x, y]; 
}

f(); // [1, undefined]
f(2); // [2, undefined]

Zerstörter Parameter mit Standardwertzuordnung

Sie können die Standardwertzuordnung mit der Zerstörungszuordnung Schreibweise verwenden:

function f([x, y] = [1, 2], {z: z} = {z: 3}) { 
  return x + y + z; 
}

f(); // 6

Spezifikationen

Browserkompatibilität

Siehe auch

• Original Vorschlag von ecmascript.org