javascript - 作者说的 "event handler function wants to unbind itself after it fires"是什么意思

Question

我目前正在按照《你不懂js》系列丛书学习JavaScript

在scope & closure本书的一部分，在讨论命名函数表达式时，作者提到了。

Without a name, if the function needs to refer to itself, for recursion, etc., the deprecated arguments.callee reference is unfortunately required. Another example of needing to self-reference is when an event handler function wants to unbind itself after it fires.

因为我在 JavaScript 方面相对缺乏经验，所以我不太确定“事件处理函数解除绑定(bind)”是什么(我知道“事件处理函数”是什么)以及它是如何工作的。

所以我只是想知道是否有人可以解释一下；它实际上做了什么？ (代码示例会更好)。

Answer 1

事件处理程序可以采用匿名函数，这很好用。

document.querySelector("button").addEventListener("click",function(){
    console.log("Clicked from anonymous func");
});

<button>Click me</button>

也可以删除事件处理程序 (removeEventListener)，并且程序员可能希望在引发事件后发生这种情况(通常，您可能只希望发生一个事件一次)。使用上面的代码会很困难，因为您无法引用充当事件监听器的匿名函数。

更改命名函数使这更容易:

function myEventHandler(){
    console.log("Clicked from named func - but it'll only work once");
    // In an event handler "this" refers to the clicked element
    this.removeEventListener('click',myEventHandler)
}

document.querySelector("button").addEventListener("click",myEventHandler);

<button>Click me</button>