首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用匿名函数的事件侦听器

使用匿名函数的事件侦听器
EN

Stack Overflow用户
提问于 2016-02-20 00:17:25
回答 2查看 12.7K关注 0票数 5

MDN上写着

如果要将参数传递给侦听器函数,则可以使用匿名函数。

经过一些实验,我想出了当我尝试用一个像这样的单参数函数(没有匿名函数)注册一个事件侦听器时

代码语言:javascript
复制
target.addEventListener(type, doSomething(parameter));

侦听器函数即使在事件未发生时也会执行,但当我将其包装在匿名函数中时

代码语言:javascript
复制
target.addEventListener(type, function () {doSomething(parameter);});

一切都按预期进行。

为什么会发生这样的行为?我猜它与闭包有某种联系。

EN

回答 2

Stack Overflow用户

发布于 2016-02-20 00:25:40

当像这样定义处理程序函数时

代码语言:javascript
复制
target.addEventListener(type, doSomething(parameter));

您正在传递函数的返回值作为处理程序。例如,考虑这个函数:

代码语言:javascript
复制
function doSomething(event) {
    return 'foo';
}

现在,函数在事件发生之前立即执行,您基本上只是将其作为处理程序进行传递:

代码语言:javascript
复制
target.addEventListener(type, 'foo');

这行不通的。

第二个例子

代码语言:javascript
复制
target.addEventListener(type, function () {doSomething(parameter);});

正确地将函数作为引用传递,而不在事件发生前执行该函数。

票数 6
EN

Stack Overflow用户

发布于 2019-04-19 03:02:08

当您编写"doSomething(parameter)“时,您实际上是在调用函数,然后函数的返回值就是结果,该结果被传递给addEventListener。"doSomething(parameter)“被执行,它并不是你真正想要的函数指针(尽管javascript没有可见的函数指针)。

如果您编写了target.addEventListener(类型,doSomething),那么实际上会像您希望的那样将函数作为参数进行传递。但是,它不会像您希望的那样将参数传递到函数调用中。这就是为什么你需要像你做的那样包装它。如果你想做一些你想做的事情,你可以这样做:

代码语言:javascript
复制
function doSomethingWrapper() {
    doSomething(parameter);
}

target.addEventListener(type, doSomethingWrapper);
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35509877

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档