Event,EventTarget,EventEmitter
Event,EventTarget,EventEmitter
EventTarget
这里说明浏览器中的
EventTarget
DOM 节点的事件操作(监听和触发),都定义在
EventTarget
接口。所有节点对象
都部署了(实现)这个接口,其他一些需要事件通信的浏览器内置对象(比如,XMLHttpRequest
、AudioNode
、AudioContext
)也部署了(实现)这个接口。
事件通常由
外部源
触发,同样也会以编程方式
触发,例如执行一个 element 的一个 HTMLElement.click( ) 方法,或通过定义事件
,然后使用 EventTarget.dispatchEvent( ) 将其派发到一个指定的目标。
该接口主要提供三个实例方法:
addEventListener()
:绑定事件的监听函数removeEventListener()
:移除事件的监听函数dispatchEvent()
:触发事件
Event
事件发生以后,会产生一个事件对象,作为参数传给监听函数。浏览器原生提供一个
Event
对象,所有的事件都是这个对象的实例,或者说继承了Event.prototype
对象。
Event
对象本身就是一个构造函数,可以用来生成新的实例。
EventEmitter
在
Node.js
的events
模块中,EventEmitter
是一个非常重要的类,很多模块都继承了它,比如Stream
、HTTP
、Net
等。
EventEmitter
的使用非常简单,它提供了on
、once
、emit
、removeListener
等方法,用于注册事件监听器、触发事件、移除事件监听器等。
Node中的 EventTarget和Event
Node.js 中的
EventTarget
和Event
对象是对EventTarget
Web API 的特定实现。
浏览器的EventTarget和node中EventEmitter 区别
Node.js 和浏览器都是基于事件驱动的平台,而 EventEmitter 和 EventTarget 分别是它们的核心事件处理机制。
区别
EventEmitter
和EventTarget
都是用来实现事件的,但是它们之间还是有一些区别的。
首先,
EventTarget
会有事件冒泡,而EventEmitter
没有事件冒泡。
因为在nodejs
中是不存在层级关系的,所有的模块都是平级的,所以EventEmitter
也就没有事件冒泡。
而在浏览器中,DOM
元素天然就有层级关系,事件冒泡也就是自然而然的事情了,如果没有事件冒泡,那么事件的传递就会变得非常麻烦。
其次就是
EventEmitter
和EventTarget
的实现方式不同;
EventEmitter
是一个发布订阅模式的实现,而EventTarget
是一个观察者模式的实现。这两种模式的区别在于,发布订阅模式中,发布者和订阅者是没有关系的,发布者只负责发布事件,订阅者只负责订阅事件,发布者和订阅者之间没有任何关系。
而观察者模式中,观察者和被观察者是有关系的,观察者会观察被观察者的变化,当被观察者发生变化时,观察者会收到通知。
这也是为什么
EventEmitter
中事件触发是可以直接通过字符串,而EventTarget
中事件触发需要通过事件对象的原因。同时也是因为这个原因他们的
API
也有所不同,EventEmitter
中会有once
这种只执行一次就移除的方法,而EventTarget
中没有这种方法。
在
nodejs
的events
模块中,其实也有EventTarget
的实现,但是它并不是继承EventEmitter
的,而是改写了EventEmitter
的实现,使其符合EventTarget
的规范。他们的区别同样也是没有事件冒泡,同时运行环境不同,服务的对象也不同。
总结
EventEmitter
和EventTarget
都是用来实现事件的,但是它们之间还是有一些区别的。最大的区别就是一个是
node
环境,一个是浏览器环境,为了服务不同的环境,它们的实现方式也不同。
EventEmitter
是一个发布订阅模式的实现,而EventTarget
是一个观察者模式的实现。
EventEmitter
中事件触发是可以直接通过字符串,而EventTarget
中事件触发需要通过事件对象。
参考:
Node.js中的EventEmitter与浏览器中的EventTarget:深度探索事件处理的异同
前端事件Event以及EventTarget
浏览器的 EventTarget 接口,Event 对象以及原生事件
EventTarget 接口
Event 对象
深入探讨:Node.js中的EventEmitter与浏览器
Nodejs-Events模块