Start · Sprachen · JavaScript · Referenz · Function.prototype.call()

Function.prototype.call()

Methode

Ruft eine Funktion sofort mit einem festgelegten <code>this</code>-Wert und einzeln übergebenen Argumenten auf.

seit JavaScript ES1 (Baseline: alle Browser) Kategorie: method-property

Signatur

Function.prototype.call(thisArg, ...args)

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', '!'));
Hallo, Anna!

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')
// );
10

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);
Food { name: 'Käse', price: 4.99, category: 'Lebensmittel' }

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);
true [object Array]

// Wichtig · Fallstricke

  • Pfeilfunktionen ignorieren thisArg: Arrow Functions haben kein eigenes this. call() reicht zwar die Argumente weiter, der this-Wert bleibt aber der des umgebenden Gültigkeitsbereichs.
  • Strict Mode vs. Sloppy Mode: Im Strict Mode (und damit in Klassen und ES-Modulen) wird thisArg unverändert übernommen, also auch null, undefined oder primitive Werte. Ohne Strict Mode wird null/undefined durch globalThis ersetzt. Das kann unbeabsichtigt globale Variablen verändern.
  • Gebundene Funktionen: Bei einer mit bind() erzeugten Funktion lässt sich this durch call() nicht mehr ändern.
  • Klassen-Konstruktoren lassen sich nicht per call() aufrufen, das wirft einen TypeError. Nutze stattdessen super() oder Reflect.construct().
  • Für hasOwnProperty gibt es heute die kürzere Variante Object.hasOwn(obj, key) (ES2022).
  • Wird call auf etwas aufgerufen, das keine Funktion ist, entsteht ein TypeError.