javascript - 如何在没有外部函数的情况下删除事件监听器

Question

遇到了真正的困境。我有一个 init 函数，其中有很多参数，这些参数内部相互依赖，无法从外部删除，这是一个元素数组，并添加到每个单击事件监听器。此事件监听器检查单击的元素是否是某个元素，然后从数组中的所有元素中删除单击监听器。问题是由于 init 函数的内部参数，我必须在事件监听器中使用 anonimus 函数，但是要删除事件监听器，我必须在removeEventListener 中传递相同的函数，因此它必须命名为 function 并且我无法获取解决方案。

大致逻辑:

let init = () =>{

  //some internal parameters here and logic

  for (let i = 0; i < elArr.length; i++) {

    elArr[i].addEventListener('click', event => {
        if (event.target.style.background ===
            elArr[pickedElement].style.background) {

            //Not working (can't define the param as a separate function due 
            //to params of this function can't be passed to there)
            for (let i = 0; i < elArr.length; i++)
                elArr[i].removeEventListener("click", event);

        } else {
            event.target.style.background = bgColor;
        }
    });  
}

Answer 1

除非我遗漏了什么，否则看起来您可以在 init 函数的内部声明命名函数，因此它仍然可以访问所有内部变量等。

let init = () => {
  //some internal parameters here and logic

  let bgCheckListener = event => {
    if (
      event.target.style.background ===
      elArr[pickedElement].style.background
    ) {
      elArr.forEach(el => {
        el.removeEventListener("click", bgCheckListener)
      })
    } else {
      event.target.style.background = bgColor
    }
  }

  elArr.forEach(el => {
    el.addEventListener("click", bgCheckListener)
  })
}