Wie entferne ich mit der .bind()-Methode hinzugefügte Ereignis-Listener?

Mit Bind() hinzugefügte Ereignis-Listener entfernen

Bei der Arbeit mit Ereignis-Listenern in JavaScript ist es wichtig, sie zu entfernen, wenn sie nicht mehr benötigt werden. insbesondere, wenn sie mit der Methode .bind() hinzugefügt wurden.

.bind() und Ereignis-Listener

Die Methode .bind() erstellt eine neue Funktion, die ist an einen bestimmten Kontext gebunden. Dadurch kann die Funktion außerhalb des Kontexts aufgerufen werden, in dem sie ursprünglich definiert wurde. Im bereitgestellten Beispiel:

this.myButton.addEventListener("click", this.clickListener.bind(this));

erstellt .bind(this) eine neue Funktion, die sicherstellt, dass sich das Schlüsselwort this in clickListener auf die MyClass-Instanz bezieht.

Entfernen des Listeners

Um die Schaltfläche in diesem Beispiel zu deaktivieren, müssen wir den Ereignis-Listener entfernen. Da .bind() jedoch eine neue Funktionsreferenz erstellt, können wir die ursprüngliche Funktion nicht einfach entfernen.

Lösung: Funktionsreferenz speichern

Die Lösung besteht darin, zu speichern die Funktionsreferenz, die von .bind() in einer Variablen zurückgegeben wird, bevor sie als Ereignis-Listener hinzugefügt wird:

const clickListenerBind = this.clickListener.bind(this);
this.myButton.addEventListener("click", clickListenerBind);

Jetzt können wir den Listener mithilfe der gespeicherten Referenz entfernen:

this.myButton.removeEventListener("click", clickListenerBind);

Andere Methoden

Obwohl die oben beschriebene Methode die korrekte Entfernung von mit .bind() hinzugefügten Listenern gewährleistet, gibt es keine bevorzugten Alternativen.

Das obige ist der detaillierte Inhalt vonWie entferne ich mit der .bind()-Methode hinzugefügte Ereignis-Listener?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!