aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/javascript/reference/functions/default_parameters
diff options
context:
space:
mode:
Diffstat (limited to 'files/de/web/javascript/reference/functions/default_parameters')
-rw-r--r--files/de/web/javascript/reference/functions/default_parameters/index.html223
1 files changed, 223 insertions, 0 deletions
diff --git a/files/de/web/javascript/reference/functions/default_parameters/index.html b/files/de/web/javascript/reference/functions/default_parameters/index.html
new file mode 100644
index 0000000000..6e88aaa134
--- /dev/null
+++ b/files/de/web/javascript/reference/functions/default_parameters/index.html
@@ -0,0 +1,223 @@
+---
+title: Default parameters
+slug: Web/JavaScript/Reference/Functions/Default_parameters
+tags:
+ - ECMAScript 2015
+ - Functions
+ - JavaScript
+translation_of: Web/JavaScript/Reference/Functions/Default_parameters
+---
+<div>{{jsSidebar("Functions")}}</div>
+
+<p><strong>Standard Funktionsparameter</strong> erlaubt es formale Parameter mit vorgegebenen Werten zu initialisieren, wenn beim Funktionsaufruf kein Wert oder <code>undefined</code> übergeben wird.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/functions-default.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="brush: js">function [<em>name</em>]([<em>param1</em>[ = defaultValue1 ][, ..., <em>paramN</em>[ = defaultValueN ]]]) {
+ <em>statements</em>
+}
+</pre>
+
+<h2 id="Beschreibung">Beschreibung</h2>
+
+<p>In JavaScript haben Funktionsparameter standardmäßig den Default-Wert {{jsxref("undefined")}}. Manchmal ist es jedoch sinnvoll einen anderen Default-Wert zu setzen. Hier helfen Default-Parameter weiter.</p>
+
+<p>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 <code>undefined</code> ist. Wenn in dem folgenden Beispiel bei dem Aufruf kein Wert für <code>b</code> mitgegeben wird, würde der Wert <code>undefined</code> sein. Bei der Auswertung von <code>a*b</code> und dem Aufruf von <code>multiply</code> wird als Rückgabewert <code>NaN</code> zurückgegeben. Im Beispiel wird deshalb dieser Rückgabewert in der zweiten Zeile der Funktion aufgefangen:</p>
+
+<pre class="brush: js">function multiply(a, b) {
+ b = (typeof b !== 'undefined') ? b : 1;
+ return a * b;
+}
+
+multiply(5, 2); // 10
+multiply(5, 1); // 5
+multiply(5); // 5
+</pre>
+
+<p>Mit dem Default-Parameter in ES2015 ist die Prüfung im Funktionskörper nicht mehr nötig. Jetzt kann man einfach <code>1</code> als den Standardwert für <code>b</code> in dem Funktionskopf definieren: </p>
+
+<pre class="brush: js">function multiply(a, b = 1) {
+ return a * b;
+}
+
+multiply(5, 2); // 10
+multiply(5, 1); // 5
+multiply(5); // 5
+</pre>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<h3 id="Übergeben_von_undefined_und_anderen_falsy_Werten">Übergeben von <code>undefined</code> und anderen falsy Werten</h3>
+
+<p>In dem zweiten Aufruf, auch wenn das erste Argument explizit auf <code>undefined</code> gesetzt ist (jedoch nicht <code>null</code> oder andere {{Glossary("Falsy", "Falsy-Werte")}}, ist der Wert des Arguments <code>num</code> beim Aufruf der Default-Wert.</p>
+
+<pre class="brush: js">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)
+</pre>
+
+<h3 id="Auswerten_beim_Aufruf">Auswerten beim Aufruf</h3>
+
+<p>Das Standard-Argument wird zum Zeitpunkt des Aufrufs ausgewertet. Somit wird - anders als z.B. in Python - ein neues Objekt bei jedem Funktionsaufruf erzeugt.</p>
+
+<pre class="brush: js">function append(value, array = []) {
+ array.push(value);
+ return array;
+}
+
+append(1); //[1]
+append(2); //[2], nicht [1, 2]
+</pre>
+
+<p>Das Gleiche gilt für Funktionen und Variablen:</p>
+
+<pre class="brush: js">function callSomething(thing = something()) {
+ return thing;
+}
+
+function something(){
+ return "sth";
+}
+
+callSomething(); //sth</pre>
+
+<h3 id="Default-Parameter_stehen_nachfolgenden_Default-Parametern_zur_Verfügung">Default-Parameter stehen nachfolgenden Default-Parametern zur Verfügung</h3>
+
+<p>Die bereits angetroffenen Parameter stehen den späteren Standardparametern zur Verfügung:</p>
+
+<pre class="brush: js">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.")
+</pre>
+
+<p>Diese Funktionalität wird in einer geradlinigen Weise angenähert und zeigt, wie viele Randfälle behandelt werden:</p>
+
+<pre class="brush: js">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, "=^_^="]
+</pre>
+
+<h3 id="Funktionen_definiert_innerhalb_des_Funktionskörpers">Funktionen definiert innerhalb des Funktionskörpers</h3>
+
+<p>Eingeführt in Gecko 33 {{geckoRelease(33)}}. Funktionen die innerhalb eines Funktionskörper deklariert werden, können nicht von Default-Parametern referenziert werden und führen zu einem {{jsxref("ReferenceError")}} (aktuell wird ein {{jsxref("TypeError")}} erzeugt, siehe {{bug(1022967)}}). Default-Parameter werden stets zuerst ausgewertet, Funktionsdeklarationen innerhalb von Funktionskörpern erst hinterher.</p>
+
+<pre class="brush: js">// Funktioniert nicht! Wirft einen ReferenceError.
+function f(a = go()) {
+ function go(){return ":P"}
+}
+</pre>
+
+<h3 id="Paramater_ohne_Default_nach_Default-Parameter">Paramater ohne Default nach Default-Parameter</h3>
+
+<p>Vor Gecko 26 {{geckoRelease(26)}} erzeugte der folgende Code einen {{jsxref("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:</p>
+
+<pre class="brush: js">function f(x=1, y) {
+ return [x, y];
+}
+
+f(); // [1, undefined]
+f(2); // [2, undefined]
+</pre>
+
+<h3 id="Zerstörter_Parameter_mit_Standardwertzuordnung">Zerstörter Parameter mit Standardwertzuordnung</h3>
+
+<p>Sie können die Standardwertzuordnung mit der <a href="/de/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destrukturierende Zuordnung</a> Schreibweise verwenden:</p>
+
+<pre class="brush: js">function f([x, y] = [1, 2], {z: z} = {z: 3}) {
+ return x + y + z;
+}
+
+f(); // 6</pre>
+
+<h2 id="Spezifikationen">Spezifikationen</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Spezifikation</th>
+ <th scope="col">Status</th>
+ <th scope="col">Kommentar</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES2015', '#sec-function-definitions', 'Function Definitions')}}</td>
+ <td>{{Spec2('ES2015')}}</td>
+ <td>Initiale Definition.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}</td>
+ <td>{{Spec2('ESDraft')}}</td>
+ <td> </td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div>
+
+
+<p>{{Compat("javascript.functions.default_parameters")}}</p>
+</div>
+
+<h2 id="Siehe_auch">Siehe auch</h2>
+
+<ul>
+ <li><a href="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values" rel="external" title="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values">Original Vorschlag von ecmascript.org</a></li>
+</ul>