Wie verhält sich das Schlüsselwort „this' innerhalb eines JavaScript-Objektliterals?

Wie sich das Schlüsselwort „this“ innerhalb eines Objektliterals in JavaScript verhält

In JavaScript bezieht sich das Schlüsselwort „this“ auf das aktuelle Objekt auf dem die Funktion aufgerufen wurde. Allerdings kann die Bindung von „this“ verwirrend sein, insbesondere wenn es innerhalb von Objektliteralen verwendet wird.

Innerhalb eines Objektliterals ist der Wert von „this“ nicht an das Objekt selbst, sondern an das globale Objekt gebunden ( Fenster in Browsern). Dies kann zu unerwartetem Verhalten führen, wie im folgenden Code zu sehen ist:

var obj1 = {
  foo: new Date(),
  bar: new MyDate(this.foo)  //  this.foo is undefined
};

In diesem Beispiel ist „this.foo“ im Konstruktor von MyDate undefiniert, da „this“ auf das globale Objekt verweist, das hat keine Eigenschaft namens „foo“.

Um dieses Problem zu beheben, können Sie „this“ explizit innerhalb des Objektliterals binden, indem Sie bind() verwenden. Methode:

var obj4 = {};
obj4.foo = new Date();
obj4.bar = new MyDate(obj4.foo.bind(obj4));

Dadurch wird sichergestellt, dass „this“ im Konstruktor von MyDate auf das richtige Objekt (obj4) verweist.

Alternativ können Sie eine Pfeilfunktion verwenden, um „this“ zu binden. an das Objekt:

var obj3 = {
  foo: new Date(),
  bar: new MyDate(() => this.foo)
};

In Pfeilfunktionen ist „this“ zum Zeitpunkt der Definition an den umgebenden Bereich gebunden, der in diesem Fall das Objekt ist selbst.

Das obige ist der detaillierte Inhalt vonWie verhält sich das Schlüsselwort „this' innerhalb eines JavaScript-Objektliterals?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!