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

Function.prototype.apply()

Methode

Ruft eine Funktion mit einem festgelegten <code>this</code>-Wert auf. Die Argumente werden als Array oder array-ähnliches Objekt übergeben.

seit JavaScript ES3 (array-ähnliche Objekte seit ES5) – Baseline: Kategorie: method-property

Signatur

Function.prototype.apply(thisArg, argsArray)

Beschreibung

apply() ruft die Funktion, auf der es aufgerufen wird, sofort auf. Das erste Argument legt fest, welchen Wert this innerhalb der Funktion hat. Das zweite Argument enthält die Argumente als Array oder als array-ähnliches Objekt, also z. B. arguments, eine NodeList oder { length: 2, 0: 'a', 1: 'b' }.

Der einzige Unterschied zu call(): call() erwartet die Argumente einzeln, apply() als eine Liste. Vor ES2015 brauchte man apply() vor allem, um eine Funktion mit einer Argumentliste variabler Länge aufzurufen, z. B. Math.max.apply(null, zahlen). Heute erledigt das meist der Spread-Operator (Math.max(...zahlen)).

Trotzdem ist apply() weiterhin nützlich:

  • Methoden ausleihen: Eine Methode eines anderen Objekts wird mit einem fremden this aufgerufen, z. B. Array.prototype-Methoden auf array-ähnlichen Objekten.
  • Wrapper und Decorators: Man leitet this und alle Argumente unverändert an die ursprüngliche Funktion weiter.
  • Älterer Code: apply() funktioniert auch in Umgebungen ohne Spread-Syntax.

Anders als bind() erzeugt apply() keine neue Funktion, sondern führt die Funktion direkt aus.

Parameter

Name Typ Default Beschreibung
$thisArg Pflicht any Wert für this beim Aufruf. Im nicht-strikten Modus wird null bzw. undefined durch das globale Objekt ersetzt, und primitive Werte werden in Objekte umgewandelt. Im strikten Modus wird der Wert unverändert übernommen.
$argsArray Array|ArrayLike|null|undefined undefined Array oder array-ähnliches Objekt mit den Argumenten für die Funktion. Bei null oder undefined wird die Funktion ohne Argumente aufgerufen.

Rückgabewert

Typ
any
Beschreibung
Der Rückgabewert der aufgerufenen Funktion mit dem angegebenen this und den angegebenen Argumenten.

Beispiele

this festlegen und Argumente als Array übergeben

const begruesse = function (gruss, satzzeichen) {
  return `${gruss}, ${this.name}${satzzeichen}`;
};

const nutzer = { name: 'Anna' };

console.log(begruesse.apply(nutzer, ['Hallo', '!']));
// Zum Vergleich mit call():
console.log(begruesse.call(nutzer, 'Servus', '?'));
Hallo, Anna! Servus, Anna?

Maximum eines Arrays – klassisch vs. modern

const messwerte = [12, 47, 3, 29];

// Klassisch mit apply()
const maxAlt = Math.max.apply(null, messwerte);

// Modern mit Spread-Syntax
const maxNeu = Math.max(...messwerte);

console.log(maxAlt, maxNeu);
47 47

Array-Methode auf array-ähnlichem Objekt ausleihen

const arrayAehnlich = { length: 3, 0: 'rot', 1: 'grün', 2: 'blau' };

// join() von Array.prototype mit fremdem this aufrufen
const text = Array.prototype.join.apply(arrayAehnlich, [' | ']);
console.log(text);

// Zwei Arrays in place zusammenführen
const ziel = [1, 2];
Array.prototype.push.apply(ziel, [3, 4, 5]);
console.log(ziel);
rot | grün | blau [1, 2, 3, 4, 5]

Logging-Wrapper, der this und Argumente weiterreicht

const mitLogging = (fn) => function (...args) {
  console.log(`Aufruf von ${fn.name} mit`, args);
  return fn.apply(this, args); // this des Aufrufers beibehalten
};

const konto = {
  saldo: 100,
  einzahlen(betrag) {
    this.saldo += betrag;
    return this.saldo;
  }
};

konto.einzahlen = mitLogging(konto.einzahlen);
console.log(konto.einzahlen(50));
Aufruf von einzahlen mit [ 50 ] 150

// Wichtig · Fallstricke

  • Arrow Functions: Bei Pfeilfunktionen wird thisArg ignoriert, weil ihr this lexikalisch aus dem umgebenden Code stammt. Die Argumente werden trotzdem übergeben.
  • Grenze für die Argumentanzahl: JavaScript-Engines begrenzen die Zahl der Argumente pro Aufruf, oft auf einige Zehn- bis Hunderttausend. Bei sehr großen Arrays kann Math.max.apply(null, riesigesArray) einen RangeError auslösen. Das gilt genauso für die Spread-Syntax. In solchen Fällen besser mit reduce() oder einer Schleife arbeiten.
  • Falscher Argumenttyp: Ist argsArray weder ein Objekt noch null/undefined (z. B. eine Zahl oder ein String), wird ein TypeError geworfen.
  • Nicht-strikter Modus: apply(null, …) setzt this auf das globale Objekt (window bzw. globalThis). Das kann ungewollt globale Variablen verändern.
  • Überschriebenes apply: Eine Funktion kann eine eigene Eigenschaft apply haben. Robuster Bibliothekscode verwendet daher Reflect.apply(fn, thisArg, args) oder Function.prototype.apply.call(fn, thisArg, args).
  • Kompatibilität: In allen Browsern und in Node.js verfügbar. Array-ähnliche Objekte als argsArray werden seit ES5 unterstützt.