diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:15 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:15 -0500 |
commit | 4b1a9203c547c019fc5398082ae19a3f3d4c3efe (patch) | |
tree | d4a40e13ceeb9f85479605110a76e7a4d5f3b56b /files/de/web/javascript/reference/global_objects/function/call | |
parent | 33058f2b292b3a581333bdfb21b8f671898c5060 (diff) | |
download | translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.gz translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.bz2 translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.zip |
initial commit
Diffstat (limited to 'files/de/web/javascript/reference/global_objects/function/call')
-rw-r--r-- | files/de/web/javascript/reference/global_objects/function/call/index.html | 163 |
1 files changed, 163 insertions, 0 deletions
diff --git a/files/de/web/javascript/reference/global_objects/function/call/index.html b/files/de/web/javascript/reference/global_objects/function/call/index.html new file mode 100644 index 0000000000..46bdb07442 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/call/index.html @@ -0,0 +1,163 @@ +--- +title: Function.prototype.call() +slug: Web/JavaScript/Reference/Global_Objects/Function/call +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/call +--- +<div>{{JSRef}}</div> + +<p>Die <code><strong>call()</strong></code> Methode ruft eine Funktion mit dem Argument this und den individuellen Parametern auf.</p> + +<div class="note"> +<p><strong>Hinweis:</strong> Die Syntax dieser Funktion ist nahezu identisch zu {{jsxref("Function.prototype.apply", "apply()")}}. Der Unterschied ist, dass <code>call()</code> eine <strong>Liste von Argumenten</strong> und <code>apply()</code> einen einzelnen <strong>Array von Argumenten</strong> akzeptiert.</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/function-call.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox"><code><var>fun</var>ction.call(<var>thisArg</var>, <var>arg1</var>, <var>arg2</var>, ...)</code></pre> + +<h3 id="Parameter">Parameter</h3> + +<dl> + <dt><code>thisArg</code></dt> + <dd>Optional. Der Wert von <code>this</code>, der für den Aufruf der Funktion <em><code>function</code></em> genutzt wird. Zu beachten ist, dass <code>this</code> möglicherweise nicht der Wert ist, den die Methode sieht: Wenn die Methode eine Funktion in {{jsxref("Functions_and_function_scope/Strict_mode", "non-strict mode", "", 1)}} ist, werden {{jsxref("Global_Objects/null", "null")}} und {{jsxref("Global_Objects/undefined", "undefined")}} mit dem globalen Objekt ersetzt und primitive Werte werden in ein Hüllobjekt umgewandelt.</dd> + <dt><code>arg1, arg2, ...</code></dt> + <dd>Argumente für das Objekt.</dd> +</dl> + +<h3 id="Rückgabewert">Rückgabewert</h3> + +<p>Das Ergebnis der aufgerufenen Funktion mit dem spezifischen <code><strong>this</strong></code> Wert und Parametern.</p> + +<h2 id="Beschreibung">Beschreibung</h2> + +<p>Beim Aufruf einer existierenden Funktion können Sie für <code>this</code> ein neues Objekt zuweisen. <code>this</code> verweist auf das aktuelle Objekt, also das aufrufende Objekt. Mit call können Sie eine Methode schreiben und an ein anderes Objekt vererben, ohne die Methode für das neue Objekt neuzuschreiben.</p> + +<h2 id="Beispiele">Beispiele</h2> + +<h3 id="Nutzung_von_call_um_Konstruktoren_für_ein_Objekt_zu_verketten">Nutzung von <code>call</code>, um Konstruktoren für ein Objekt zu verketten</h3> + +<p>Man kann <code>call</code> nutzen, um Konstruktoren für ein Objekt, ähnlich wie in Java, zu verketten. Im folgenden Beispiel wird der Konstruktor für das <code>Product</code> Objekt mit zwei Parametern, <code>name</code> und <code>price</code>, definiert. Zwei andere Funktionen <code>Food</code> und <code>Toy</code> rufen <code>Product</code> auf und übergeben <code>this</code>, <code>name</code> und <code>price</code>. <code>Product</code> initialisiert die Eigenschaften <code>name</code> und <code>price</code> und beide speziellen Funktionen definieren <code>category</code>.</p> + +<pre class="brush: js">function Product(name, price) { + this.name = name; + this.price = price; +} + +function Food(name, price) { + Product.call(this, name, price); + this.category = 'food'; +} + +function Toy(name, price) { + Product.call(this, name, price); + this.category = 'toy'; +} + +var cheese = new Food('feta', 5); +var fun = new Toy('robot', 40); +</pre> + +<h3 id="Nutzung_von_call_zum_Aufruf_einer_anonymen_Funktion">Nutzung von <code>call</code> zum Aufruf einer anonymen Funktion</h3> + +<p>In diesem komplett konstruierten Beispiel erstellen wir eine anonyme Funktion und nutzen <code>call</code>, um diese für jedes Objekt in einem Array aufzurufen. Der Hauptnutzen für die Nutzung anonymer Funktionen hier, ist das hinzufügen einer Print-Funktion für jedes Objekt, welche den rechten Index des Objekts in dem eingegebenen Array ausgeben kann. Die Übergabe des Objektes als <code>this</code>-Wert ist hier nicht zwingend erforderlich, wurde aber zur Veranschaulichung genutzt.</p> + +<pre class="brush: js">var animals = [ + { species: 'Lion', name: 'King' }, + { species: 'Whale', name: 'Fail' } +]; + +for (var i = 0; i < animals.length; i++) { + (function(x) { + this.print = function() { + console.log('#' + x + ' ' + this.species + + ': ' + this.name); + } + this.print(); + }).call(animals[i], i); +} +</pre> + +<h3 id="Einsatz_von_call_zum_aufrufen_einer_Funktion_mit_spezifiziertem_Kontext_für_'this'">Einsatz von <code>call</code> zum aufrufen einer Funktion mit spezifiziertem Kontext für '<code>this</code>'</h3> + +<p>Im unten stehenden Beispiel wird das <code>this</code>Objekt der <code>greet</code> Funktion beim Aufruf auf <code>obj</code> gesetzt.</p> + +<pre class="brush: js">function greet() { + var reply = [this.animal, 'typically sleep betreen', this.sleepDuration].join(' '); + console.log(reply); +} + +var obj = { + animal: 'cats', sleepDuration: '12 and 16 hours' +}; + +greet.call(obj); // cats typically sleep between 12 and 16 hours +</pre> + +<h3 id="Eine_Funktion_mit_call_ausführen_ohne_den_ersten_Parameter_zu_setzen.">Eine Funktion mit <code>call</code> ausführen ohne den ersten Parameter zu setzen.</h3> + +<p>Im unten stehenden Beispiel wird die <code>display</code> Funktion aufgerufen ohne den ersten Parameter zu übergeben. Wenn der erste Parameter nicht übergeben wird, ist <code>this</code> das globale Objekt.</p> + +<pre class="brush: js">var sData = 'Wisen'; + +function display(){ + console.log('sData value is %s', this.sData); +} + +display.call(); // sData value is Wisen +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initiale Definition. Implementiert in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3.4.4', 'Function.prototype.call')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function.prototype.call', 'Function.prototype.call')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function.prototype.call', 'Function.prototype.call')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browserkompatibilität">Browserkompatibilität</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Function.call")}}</p> +</div> + +<h2 id="See_also" name="See_also">Siehe auch</h2> + +<ul> + <li>{{jsxref("Function.prototype.bind()")}}</li> + <li>{{jsxref("Function.prototype.apply()")}}</li> + <li><a href="/de/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">Einführung in objektorientiertes JavaScript</a></li> +</ul> |