aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/javascript/reference/global_objects/function/call
diff options
context:
space:
mode:
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.html163
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 &lt; 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>