Question

我正在尝试调用一个函数，该函数具有触发事件时所依赖的参数。但是，此函数不得匿名，因为将来会删除该侦听器。

我尝试对包装器使用函数表达式，并将对this的引用作为参数传递给主要函数：

<div id="div">
  click
</div>

function main() {
  let foo = "foo";
  let bar = "bar";
  let wrapFunction = function(event) {
    goodFunction(event, foo, bar, this);
  }
  document.getElementById("div").addEventListener("click", wrapFunction);
}
function goodFunction(e, foo, bar, wrapFunction) {
  alert(foo);
  alert(bar);
  document.getElementById("div").removeEventListener("click", wrapFunction);
}
main();

除document.getElementById("div").removeEventListener("click", wrapFunction);行外，其他所有内容均正常运行。这是我无法弄清的部分，我们将不胜感激。

Answer 1

除了传递this到goodFunction(event, foo, bar, this)内部的wrapFunction调用之外，您还可以传递wrapFunction本身，以查看它是在调用处理程序时定义的：

function main() {
  let foo = "foo";
  let bar = "bar";
  let wrapFunction = function(event) {

    /* wrapFunction is defined so pass it directly to goodFunction */
    goodFunction(event, foo, bar, wrapFunction);
  }
  document.getElementById("div").addEventListener("click", wrapFunction);
}

function goodFunction(e, foo, bar, wrapFunction) {
  alert(foo);
  alert(bar);
  document.getElementById("div").removeEventListener("click", wrapFunction);
}
main();

<div id="div">Click me</div>

JavaScript：如何将参数传递给最终将被删除的侦听器函数

1 个答案: