如何删除通过.bind()方法添加的事件监听器？

删除通过 Bind() 添加的事件监听器

在 JavaScript 中使用事件监听器时，在不再需要时删除它们至关重要，特别是当使用 .bind() 方法添加它们时。

.bind() 和事件监听器

.bind() 方法创建一个新函数有与其绑定的特定上下文。这允许在最初定义函数的上下文之外调用该函数。在提供的示例中：

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

.bind(this) 创建一个新函数，确保 clickListener 中的 this 关键字引用 MyClass 实例。

删除监听器

要禁用此示例中的按钮，我们需要删除事件侦听器。但是，由于 .bind() 创建了一个新的函数引用，因此我们不能简单地删除原始函数。

解决方案：存储函数引用

解决方案是存储在将变量添加为事件监听器之前，在变量中使用 .bind() 返回的函数引用：

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

现在，我们可以使用存储的引用删除监听器：

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

其他方法

虽然上述方法可以确保正确删除使用 .bind() 添加的侦听器，但没有首选替代方案。

以上是如何删除通过.bind()方法添加的事件监听器？的详细内容。更多信息请关注PHP中文网其他相关文章！