Comment supprimer les écouteurs d’événements ajoutés avec la méthode .bind() ?

Suppression des écouteurs d'événements ajoutés avec Bind()

Lorsque vous travaillez avec des écouteurs d'événements en JavaScript, il est crucial de les supprimer lorsqu'ils ne sont plus nécessaires, surtout lorsqu'ils ont été ajoutés à l'aide de la méthode .bind().

.bind() et Event Listeners

La méthode .bind() crée une nouvelle fonction qui est lié à un contexte spécifique. Cela permet à la fonction d'être appelée en dehors du contexte dans lequel elle a été initialement définie. Dans l'exemple fourni :

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

le .bind(this) crée une nouvelle fonction qui garantit que le mot clé this dans clickListener fait référence à l'instance MyClass.

Suppression de l'écouteur

Pour désactiver le bouton dans cet exemple, nous devons supprimer l'écouteur d'événement. Cependant, puisque .bind() crée une nouvelle référence de fonction, nous ne pouvons pas simplement supprimer la fonction d'origine.

Solution : stocker la référence de fonction

La solution est de stocker la référence de fonction renvoyée par .bind() dans une variable avant de l'ajouter en tant qu'écouteur d'événement :

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

Maintenant, nous pouvons supprimer l'écouteur en utilisant la référence stockée :

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

Autres méthodes

Bien que la méthode décrite ci-dessus garantisse la suppression correcte des écouteurs ajoutés avec .bind(), il n'y a pas d'alternative préférée.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!