javascript 浏览器端是否有任何 EventEmitter 在 nodejs 中具有类似的逻辑？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/45831911/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is there any EventEmitter in browser side that has similar logic in nodejs?
提问by Xin
It is so easy to use eventEmitter in node.js:
在 node.js 中使用 eventEmitter 非常简单：
var e = new EventEmitter();
e.on('happy', function(){console.log('good')});
e.emit('happy');
Any client side EventEmitter in browser native?
浏览器本机中的任何客户端 EventEmitter ？
回答by Brad
In modern browsers, there is EventTarget.
在现代浏览器中，有 EventTarget。
class MyClass extends EventTarget {
doSomething() {
this.dispatchEvent(new Event('something'));
}
}
const instance = new MyClass();
instance.addEventListener('something', (e) => {
console.log('Instance fired "something".', e);
});
instance.doSomething();
Additional Resources:
其他资源：
Maga Zandaqo has an excellent detailed guide here: https://medium.com/@zandaqo/eventtarget-the-future-of-javascript-event-systems-205ae32f5e6b
MDN has some documentation: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget
Polyfill for Safari and other incapable browsers: https://github.com/ungap/event-target
Maga Zandaqo 在这里有一个很好的详细指南：https://medium.com/@zandaqo/eventtarget-the-future-of-javascript-event-systems-205ae32f5e6b
MDN 有一些文档：https: //developer.mozilla.org/en-US/docs/Web/API/EventTarget
Safari 和其他无功能浏览器的 Polyfill：https: //github.com/ungap/event-target
回答by Xin
Create a customized event in the client, and attach to dom element:
在客户端创建自定义事件，并附加到 dom 元素：
var event = new Event('build');
// Listen for the event.
elem.addEventListener('build', function (e) { /* ... */ }, false);
// Dispatch the event.
elem.dispatchEvent(event);
This is referred from: https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_eventsThanks Naeem Shaikh
这是参考自：https: //developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events感谢 Naeem Shaikh
回答by Alparslan
This is enough for given case.
这对于给定的情况就足够了。
class EventEmitter{
constructor(){
this.callbacks = {}
}
on(event, cb){
if(!this.callbacks[event]) this.callbacks[event] = [];
this.callbacks[event].push(cb)
}
emit(event, data){
let cbs = this.callbacks[event]
if(cbs){
cbs.forEach(cb => cb(data))
}
}
}
Update: I just published little bit more evolved version of it. It is very simple yet probably enough: https://www.npmjs.com/package/alpeventemitter
更新：我刚刚发布了它的更进化版本。它非常简单但可能足够了：https: //www.npmjs.com/package/alpeventemitter
回答by Mathieu CAROFF
I ended up using this:
我最终使用了这个：
export let createEventEmitter = () => {
let callbackList: (() => any)[] = []
return {
on(callback: () => any) {
callbackList.push(callback)
},
emit() {
callbackList.forEach((callback) => {
callback()
})
},
}
}
回答by JiangangXiong
You need a JavaScript library, like this https://github.com/Olical/EventEmitter？
你需要一个 JavaScript 库，像这样https://github.com/Olical/EventEmitter？
