Signatur
Beschreibung
call() ruft eine Funktion sofort auf und legt dabei fest, welchen Wert this innerhalb der Funktion hat. Die übrigen Argumente werden einzeln (kommagetrennt) an die Funktion weitergereicht. Rückgabewert ist das, was die aufgerufene Funktion zurückgibt.
Typische Einsatzfälle sind das Ausleihen von Methoden, also z. B. Array.prototype-Methoden auf array-ähnliche Objekte wie arguments oder NodeList anwenden. Weitere Fälle: der Aufruf eines Eltern-Konstruktors in klassischer Prototyp-Vererbung und der sichere Aufruf von Object.prototype-Methoden wie hasOwnProperty oder toString, selbst wenn ein Objekt diese überschreibt.
Der Unterschied zu apply() liegt nur in der Übergabe der Argumente: call(obj, a, b) nimmt sie einzeln entgegen, apply(obj, [a, b]) als Array. bind() ruft die Funktion dagegen nicht auf, sondern gibt eine neue Funktion mit fest gebundenem this zurück. Im modernen Code lässt sich apply() meist durch call(obj, ...array) ersetzen.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $thisArg | any | undefined | Wert, der beim Aufruf als this verwendet wird. Außerhalb des Strict Mode werden null und undefined durch globalThis ersetzt und primitive Werte in Objekte umgewandelt (Boxing). |
| $...args | any | Beliebig viele Argumente, die einzeln an die Funktion übergeben werden. |
Beispiele
this explizit festlegen
function greet(greeting, punctuation) {
return `${greeting}, ${this.name}${punctuation}`;
}
const user = { name: 'Anna' };
console.log(greet.call(user, 'Hallo', '!'));
Array-Methoden auf array-ähnliche Objekte anwenden
function sumAll() {
// arguments ist kein echtes Array
return Array.prototype.reduce.call(arguments, (acc, n) => acc + n, 0);
}
console.log(sumAll(1, 2, 3, 4));
// Im Browser: NodeList filtern
// const links = Array.prototype.filter.call(
// document.querySelectorAll('a'),
// (a) => a.href.startsWith('https')
// );
Eltern-Konstruktor aufrufen (Prototyp-Vererbung)
function Product(name, price) {
this.name = name;
this.price = price;
}
function Food(name, price) {
Product.call(this, name, price); // Eigenschaften des Elternteils übernehmen
this.category = 'Lebensmittel';
}
const cheese = new Food('Käse', 4.99);
console.log(cheese);
Sicherer Zugriff auf Object.prototype-Methoden
const data = Object.create(null); // kein Prototyp, kein hasOwnProperty
data.id = 42;
const has = Object.prototype.hasOwnProperty.call(data, 'id');
const type = Object.prototype.toString.call([]);
console.log(has, type);
// Wichtig · Fallstricke
- Pfeilfunktionen ignorieren
thisArg: Arrow Functions haben kein eigenesthis.call()reicht zwar die Argumente weiter, derthis-Wert bleibt aber der des umgebenden Gültigkeitsbereichs. - Strict Mode vs. Sloppy Mode: Im Strict Mode (und damit in Klassen und ES-Modulen) wird
thisArgunverändert übernommen, also auchnull,undefinedoder primitive Werte. Ohne Strict Mode wirdnull/undefineddurchglobalThisersetzt. Das kann unbeabsichtigt globale Variablen verändern. - Gebundene Funktionen: Bei einer mit
bind()erzeugten Funktion lässt sichthisdurchcall()nicht mehr ändern. - Klassen-Konstruktoren lassen sich nicht per
call()aufrufen, das wirft einenTypeError. Nutze stattdessensuper()oderReflect.construct(). - Für
hasOwnPropertygibt es heute die kürzere VarianteObject.hasOwn(obj, key)(ES2022). - Wird
callauf etwas aufgerufen, das keine Funktion ist, entsteht einTypeError.