删除需要参数的事件侦听器

Question

我有：

e.addEventListener("click",()=>{alert(this.innerText);});

并且我需要能够将其删除。

如果我不使用匿名函数以便可以使用removeEventListener，如何将this传递给命名函数？

function f() { 
   //how do I access the "this"?
}
e.addEventListener("click", f);

Answer 1

您遇到的唯一问题是，由于您是内联声明的，因此您的函数没有任何处理。您要做的就是移动相同的声明并将其分配给变量：

const cb = () => alert(this.innerText);
e.addEventListener('click', cb);
e.removeEventListener('click', cb);

Answer 2

我通常只是创建一个更友好的函数来使用。

const listen = (el, ...args) => {
    el.addEventListener(...args);
    return{
        remove: () => el.removeEventListener(...args)
    };
};

所以您可以做类似...

const listener = listen(document, 'click', () => {
    console.log('click');
    listener.remove();
});