Comment supprimer les écouteurs d'événements ajoutés avec `bind()` en JavaScript ?

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

En JavaScript, les écouteurs d'événements peuvent être ajoutés à l'aide de la méthode bind(). Cette méthode crée une nouvelle référence de fonction, permettant à l'écouteur d'événement de conserver l'accès au contexte souhaité. Cependant, lorsqu'il s'agit de supprimer de tels écouteurs d'événements, l'approche standard consiste à suivre manuellement chaque écouteur ajouté avec bind().

Suivi des références des écouteurs de liaison

Une méthode de supprimer les écouteurs d'événements ajoutés avec bind() consiste à garder une trace des références de fonction. Cela nécessite de conserver une variable pour stocker la fonction liée et de la transmettre explicitement lors de la suppression de l'écouteur.

<code class="js">// Store the bound function reference
var clickListenerBind = this.clickListener.bind(this);

// Add the event listener with the bound reference
this.myButton.addEventListener("click", clickListenerBind);

// Remove the event listener using the stored reference
this.myButton.removeEventListener("click", clickListenerBind);</code>

Approche plus simple

Une alternative plus simple et plus directe au manuel le suivi des références d'écouteur implique d'attribuer directement la référence de fonction liée à une variable. Cela permet à l'écouteur d'être supprimé de la même manière que n'importe quel autre écouteur d'événement.

<code class="js">const listener = this.clickListener.bind(this);

this.myButton.addEventListener("click", listener);

this.myButton.removeEventListener("click", listener);</code>

Cette approche élimine le besoin de variables de suivi supplémentaires et garantit une suppression cohérente des écouteurs d'événements, quelle que soit la manière dont elles ont été initialement ajoutées.

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!