Heim > Web-Frontend > js-Tutorial > Pfeilfunktionen vs. Methodendeklarationen in ES6: Warum funktioniert „das' in Pfeilfunktionen nicht wie erwartet?

Pfeilfunktionen vs. Methodendeklarationen in ES6: Warum funktioniert „das' in Pfeilfunktionen nicht wie erwartet?

Linda Hamilton
Freigeben: 2024-12-15 13:41:09
Original
291 Leute haben es durchsucht

Arrow Functions vs. Method Declarations in ES6: Why Doesn't `this` Work as Expected in Arrow Functions?

Pfeilfunktionen vs. Methodendeklarationen in ES6

Beim Eintauchen in ES6 kann das folgende Problem auftreten:

var person = {
  name: "jason",

  shout: () => console.log("my name is ", this.name)
};

person.shout(); // Prints "my name is "
Nach dem Login kopieren

Die Funktion soll auf die Namenseigenschaft im Personenobjekt zugreifen. Die Konsole gibt jedoch nur „mein Name ist“ aus.

Erklärung:

Dieses Verhalten ergibt sich aus der besonderen Natur der Pfeilfunktionen in ES6. Pfeilfunktionen binden im Gegensatz zu herkömmlichen Funktionsdeklarationen nicht das Schlüsselwort this. Stattdessen erben sie diese Bindung von ihrem umgebenden Bereich, der in diesem Fall der globale Bereich ist.

Lösung:

Um dieses Problem zu beheben, können Sie Folgendes tun Verwenden Sie das ES6-Methodendeklarationsmuster, das die gewünschte Bindung von Folgendes beibehält:

var person = {
  name: "jason",

  shout() {
    console.log("my name is ", this.name);
  }
};

person.shout(); // Prints "my name is jason"
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonPfeilfunktionen vs. Methodendeklarationen in ES6: Warum funktioniert „das' in Pfeilfunktionen nicht wie erwartet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage