Standard Funktionsparameter erlaubt es formale Parameter mit vorgegebenen Werten zu initialisieren, wenn beim Funktionsaufruf kein Wert oder undefined übergeben 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 und anderen falsy Werten

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

function test(num = 1) {
  console.log(typeof num);
}

test();          // 'number' (num wird auf 1 gesetzt)
test(undefined); // 'number' (num wird auf 1 gesetzt)

// test with other falsy values:
test('');        // 'string' (num wird auf '' gesetzt)
test(null);      // 'object' (num wird auf null gesetzt)

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 (aktuell wird ein TypeError erzeugt, siehe Bug 1022967). 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 destrukturierende Zuordnung Schreibweise verwenden:

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

f(); // 6

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

Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!

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 49Edge Vollständige Unterstützung 14Firefox Vollständige Unterstützung 15IE Keine Unterstützung NeinOpera Vollständige Unterstützung 36Safari Vollständige Unterstützung 10WebView Android Vollständige Unterstützung 49Chrome Android Vollständige Unterstützung 49Edge Mobile Vollständige Unterstützung 14Firefox Android Vollständige Unterstützung 15Opera Android Vollständige Unterstützung 36Safari iOS Vollständige Unterstützung 10Samsung Internet Android Vollständige Unterstützung 5.0nodejs Vollständige Unterstützung 6.0.0
Parameters without defaults after default parametersChrome Vollständige Unterstützung 49Edge Vollständige Unterstützung 14Firefox Vollständige Unterstützung 26IE Keine Unterstützung NeinOpera Vollständige Unterstützung 36Safari Vollständige Unterstützung 10WebView Android Vollständige Unterstützung 49Chrome Android Vollständige Unterstützung 49Edge Mobile Vollständige Unterstützung 14Firefox Android Vollständige Unterstützung 26Opera Android Vollständige Unterstützung 36Safari iOS Vollständige Unterstützung 10Samsung Internet Android Vollständige Unterstützung 5.0nodejs Vollständige Unterstützung Ja
Destructured parameter with default value assignmentChrome Vollständige Unterstützung 49Edge ? Firefox Vollständige Unterstützung 41IE Keine Unterstützung NeinOpera ? Safari ? WebView Android Vollständige Unterstützung 49Chrome Android Vollständige Unterstützung 49Edge Mobile ? Firefox Android Vollständige Unterstützung 41Opera Android ? Safari 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

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: schlagi123, Eiknheimer, serv-inc, StevenS77, kdex, leonschwanitz
Zuletzt aktualisiert von: schlagi123,