如何从内部访问函数对象？答案

【问题标题】：How to access a function object from within?如何从内部访问函数对象？
【发布时间】：2016-10-24 10:14:56
【问题描述】：

假设我想在一个按钮上注册一个一次性事件监听器，我可以这样写：

var someButton;
var once = function() {
  console.log("clicked");
  someButton.removeEventListener("click", once);
};
someButton.addEventListener("click", once);

如果我什至不想为该函数命名怎么办？喜欢：

var someButton;
someButton.addEventListener("click", function() {
  console.log("clicked");
  someButton.removeEventListener("click", /* what goes here? */);
});

【问题讨论】：

没错！这就是为什么（除其他原因外）最好提供命名函数作为处理程序......

标签： javascript function

【解决方案1】：

你需要给它一个名字。不过，您可以使用命名函数表达式。

someButton.addEventListener("click", function foo () {
  console.log("clicked");
  someButton.removeEventListener("click", foo);
});

它将被限定，因此只能从函数内部访问。

或者，使用 addEventListener 的新选项语法（非常新，需要 Chrome 55 或 Firefox 50，在撰写本文时没有 MSIE、Opera 或稳定的 Safari 支持）选项语法：

someButton.addEventListener("click", function () {
  console.log("clicked");
}, { once: true });

【讨论】：

【解决方案2】：

如果我什至不想为该函数命名怎么办？喜欢：

还是给它起个名字吧！

var someButton;
someButton.addEventListener("click", function once() {
  console.log("clicked");
  someButton.removeEventListener("click", once);
});

这有额外的好处，您的堆栈跟踪现在将显示函数名称。

【讨论】：

另见：stackoverflow.com/questions/3854141/…

【解决方案3】：

您可以为函数指定一个不在范围内的名称，除了它内部：

var someButton;
someButton.addEventListener("click", function handler() {
  console.log("clicked");
  someButton.removeEventListener("click", handler);
});

不会在someButton 所在的范围内创建handler 标识符绑定。（历史记录：IE8 及更早版本有一个错误。）

如果您真的不想这样做，并且您不介意使用松散模式并使用已弃用的东西，您可以改用 arguments.callee：

// NOT RECOMMENDED AT ALL. WILL NOT WORK IN STRICT MODE.
var someButton;
someButton.addEventListener("click", function() {
  console.log("clicked");
  someButton.removeEventListener("click", arguments.callee);
});

【讨论】：