基于Node如何实现EventEmitter,过程是什么
Admin 2022-07-18 群英技术资讯 860 次浏览
这篇文章主要介绍了基于Node如何实现EventEmitter,过程是什么相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇基于Node如何实现EventEmitter,过程是什么文章都会有所收获,下面我们一起来看看吧。最近做了商品批发的需求,需要针对不同的商户选择对应的批发商品回显到原来的界面。由于该项目的代码是公司古董级别(这种代码都是程序猿的痛),解决问题的时候都是小心翼翼的。为了避免这种问题减少外部依赖,手动封装事件派发的函数。
我们了解到,Node采用了事件驱动机制,而EventEmitter就是Node实现事件驱动的基础
在EventEmitter的基础上,Node几乎所有的模块都继承了这个类,这些模块拥有了自己的事件,可以绑定/触发监听器,实现了异步操作
Node.js 里面的许多对象都会分发事件,比如 fs.readStream 对象会在文件被打开的时候触发一个事件
这些产生事件的对象都是 events.EventEmitter 的实例,这些对象有一个 eventEmitter.on() 函数,用于将一个或多个函数绑定到命名事件上
Node的events模块只提供了一个EventEmitter类,这个类实现了Node异步事件驱动架构的基本模式――观察者模式
在这种模式中,被观察者(主体)维护着一组其他对象派来(注册)的观察者,有新的对象对主体感兴趣就注册观察者,不感兴趣就取消订阅,主体有更新的话就依次通知观察者们
const EventEmitter = require('events')
class MyEmitter extends EventEmitter {}
const myEmitter = new MyEmitter()
function callback() {
console.log('触发了event事件!')
}
myEmitter.on('event', callback)
myEmitter.emit('event')
myEmitter.removeListener('event', callback);
基本代码如下所示:
//事件派发机制
(function() {
var EventDispatcher = function() {
var EventDispatcherClosure = function() {
};
EventDispatcherClosure.prototype = {
/**
* 注册事件
* @param {Object} key
* @param {Object} fn
*/
on: function(key, fn) {
//获取当前的事件对象
var curEvents = this._getCurEvents(key);
//先检查该事件是否已经注册过了
var flag = false;
for (var i = 0, len = curEvents.length; i < len; i++) {
if (curEvents[i].name == fn.name) {
//已经出现过了,以最新注册的函数为主
flag = true;
curEvents[i] = fn;
break;
}
}
if (!flag) {
curEvents[curEvents.length] = fn;
}
this._register(key, curEvents);
},
/**
* 派发事件
* @param {Object} key
* @param {Object} data
*/
dispatch: function(key) {
//获取当前的事件对象
var curEvents = this._getCurEvents(key);
var shouldDispatch = true;
for (var i = 0, len = curEvents.length; shouldDispatch && i < len; i++) {
try {
//获取参数
var args = [];
for (var j = 1, len1 = arguments.length; j < len1; j++) {
args.push(arguments[j]);
}
shouldDispatch = curEvents[i].apply({}, args);
} catch (e) {
shouldDispatch = false;
}
}
return shouldDispatch;
},
remove: function(key) {
if (this._getCurEvents(key)) {
delete EventDispatcherClosure.events[key];
}
},
/**
* 根据key获取事件列表
* @param {Object} key
*/
_getCurEvents: function(key) {
return EventDispatcherClosure.events[key] || [];
},
/**
* 注册时间
* @param {Object} key
* @param {Object} events
*/
_register: function(key, events) {
EventDispatcherClosure.events[key] = events;
},
};
EventDispatcherClosure.events = {};
return {
create: function() {
return new EventDispatcherClosure();
}
};
};
window.EventDispatcher = new EventDispatcher().create();
})();
首先定义一个全局变量的匿名函数,然后将全局变量挂在window上面,这样可以让我们在开发过程中的调用。在匿名函数的原型链上面添加事件分发、事件监听、事件删除等方法。
事件分发的调用
EventDispatcher.dispatch("test", obj)
事件监听
EventDispatcher.on("test", function callback(obj) {
})
事件删除
EventDispatcher.on("test")
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
这篇文章主要介绍了详解React中共享组件逻辑的三种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
jQuery中让input框失去焦点的方法:1、利用“$("input元素")”语句来获取input元素对象;2、利用blur()方法让input元素对象失去焦点即可,语法为“元素对象.blur()”。
高阶函数就是函数式编程的一种实现方案,通常把接受一个或多个函数作为参数,或者返回一个函数的函数叫做高阶函数。本文主要介绍vue常用高阶函数以及案例,感兴趣的朋友继续往下看吧。
构造函数优点是,构造函数创建的属性和方法可以在实例之间共享。缺点为如果实例之间有相同的方法,这个方法会在每个实例上创建一遍,这样显然会造成系统资源的浪费。
在js中,存在着N多的关于高度和宽度的属性,比如:clientHeight、offsetHeight、scrollHeight、availHeight、scrollLeft、scrollTop、style.height、innerHeight、o
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008