addEventListener 的另类写法

　你会看到这个提示，那是因为你的系统无法识别某栏目的模型信息，或者你新建模型后，没为这个模型设计单独的模板。不同模型的文档浏览页的模板为：article_模型名字标识.htm 如“article_article.htm”，更多的信息你可以在频道模型管理的地方查看。

文件类型 内容：
模板调用标记：

.exe

语言内容：
模板调用标记：

简体中文

软件类型 内容：
模板调用标记：

国产软件

授权方式 内容：
模板调用标记：

共享软件

操作系统 内容：
模板调用标记：

软件等级 内容：
模板调用标记：

官方网址 内容：
模板调用标记：

演示网址 内容：
模板调用标记：

软件大小课程时长 内容：
模板调用标记：

下载资料 内容：
模板调用标记：

详细介绍 内容：
模板调用标记：

addEventListener 参数如下

前端科普 - addEventListener 的另类写法

一直把 listener 记成是响应函数，function 类型。相信很多人也是这么理解的。多数时候是这么使用

前端科普 - addEventListener 的另类写法

第一个参数没什么异议，第二个参数传一个 function，第三个参数传 false，事件流为了和低版本IE保持一致（都冒泡）。

在读 iscroll.js （5.1.3）源码时发现还有这样一种写法

前端科普 - addEventListener 的另类写法

简化为如下测试代码

前端科普 - addEventListener 的另类写法

没错，第二个参数不是 function，而是一个 object。一下糊涂了，世界观一时半会没改变过来。怎么能是一个对象呢？惯性思维和不看规范带来的后患是巨大的。点击文档没有报错，说明确实是可以这么使用的。

实际 W3C DOM2 Events 里定义的listener，没说必须是 function 类型。

Interface EventListener (introduced in DOM Level 2)

前端科普 - addEventListener 的另类写法

只要实现了以上接口就都能作为 listener，简单说只要给对象添加 handleEvent 方法就可以作为 listener了。

通过这种方式添加事件的一好处就是当你采用类式开发时this能轻松的绑定到当前类上。如下

前端科普 - addEventListener 的另类写法

下载级别 内容：
模板调用标记：

需要金币 内容：
模板调用标记：

课程难度 内容：
模板调用标记：

(责任编辑：zengmumu)