如何刪除透過.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中文網其他相關文章！