node.js如何自定义实现一个EventEmitter


Posted in Javascript onJuly 16, 2021

前言

最近做了商品批发的需求,需要针对不同的商户选择对应的批发商品回显到原来的界面。由于该项目的代码是公司古董级别(这种代码都是程序猿的痛),解决问题的时候都是小心翼翼的。为了避免这种问题减少外部依赖,手动封装事件派发的函数。

一、是什么

我们了解到,Node采用了事件驱动机制,而EventEmitter就是Node实现事件驱动的基础
在EventEmitter的基础上,Node几乎所有的模块都继承了这个类,这些模块拥有了自己的事件,可以绑定/触发监听器,实现了异步操作
Node.js 里面的许多对象都会分发事件,比如 fs.readStream 对象会在文件被打开的时候触发一个事件
这些产生事件的对象都是 events.EventEmitter 的实例,这些对象有一个 eventEmitter.on() 函数,用于将一个或多个函数绑定到命名事件上

二、nodejs中EventEmitter使用方法

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")

代码封装的比较简单

到此这篇关于node.js如何自定义实现一个EventEmitter的文章就介绍到这了,更多相关node实现EventEmitter内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
元素的内联事件处理函数的特殊作用域在各浏览器中存在差异
Jan 12 Javascript
jQuery移除元素自动解绑事件实现思路及代码
May 31 Javascript
jquery validate表单验证的基本用法入门
Jan 18 Javascript
Angularjs中如何使用filterFilter函数过滤
Feb 06 Javascript
利用原生JS与jQuery实现数字线性变化的动画
Feb 24 Javascript
JS+HTML5实现图片在线预览功能
Jul 22 Javascript
JavaScript运行原理分析
Feb 09 Javascript
微信小程序之多列表的显示和隐藏功能【附源码】
Aug 06 Javascript
vue点击input弹出带搜索键盘并监听该元素的方法
Aug 25 Javascript
页面内锚点定位及跳转方法总结(推荐)
Apr 24 Javascript
node-red File读取好保存实例讲解
Sep 11 Javascript
vue项目实现减少app.js和vender.js的体积操作
Nov 12 Javascript
node.js使用express-fileupload中间件实现文件上传
Jul 16 #Javascript
html5 录制mp3音频支持采样率和比特率设置
js基础语法与maven项目配置教程案例
JavaScript与JQuery框架基础入门教程
Jul 15 #Javascript
Python机器学习之决策树和随机森林
微信小程序scroll-view不能左右滑动问题的解决方法
Vue Element-ui表单校验规则实现
Jul 09 #Vue.js
You might like
PHP 解决utf-8和gb2312编码转换问题
2010/03/18 PHP
php提示undefined index的几种解决方法
2012/05/21 PHP
PHP dirname功能及原理实例解析
2020/10/28 PHP
JavaScript 异步方法队列链实现代码分析
2010/06/05 Javascript
Jquery拖拽并简单保存的实现代码
2010/11/28 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
2014/10/20 Javascript
JavaScript中的console.log()函数详细介绍
2014/12/29 Javascript
three.js绘制地球、飞机与轨迹的效果示例
2017/02/28 Javascript
详解ECMAScript6入门--Class对象
2017/04/27 Javascript
Vue.js常用指令之循环使用v-for指令教程
2017/06/27 Javascript
基于ES6作用域和解构赋值详解
2017/11/03 Javascript
JS实现倒序输出的几种常用方法示例
2019/04/13 Javascript
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
2020/04/24 Javascript
[55:39]DOTA2-DPC中国联赛 正赛 VG vs LBZS BO3 第二场 1月19日
2021/03/11 DOTA
获取Django项目的全部url方法详解
2017/10/26 Python
Python处理CSV与List的转换方法
2018/04/19 Python
Python3实现爬取简书首页文章标题和文章链接的方法【测试可用】
2018/12/11 Python
六行python代码的爱心曲线详解
2019/05/17 Python
python twilio模块实现发送手机短信功能
2019/08/02 Python
opencv-python 读取图像并转换颜色空间实例
2019/12/09 Python
Python字典深浅拷贝与循环方式方法详解
2020/02/09 Python
记一次pyinstaller打包pygame项目为exe的过程(带图片)
2020/03/02 Python
python time()的实例用法
2020/11/03 Python
HTML5 Web Database 数据库的SQL语句的使用方法
2012/12/09 HTML / CSS
香港化妆品经销商:我的公主
2016/08/05 全球购物
一套英文Java笔试题面试题
2016/04/21 面试题
大学毕业生通用自荐信范文
2013/10/31 职场文书
汽车促销活动方案
2014/03/31 职场文书
国庆节促销广告语2014
2014/09/19 职场文书
中共广东省委常委会党的群众路线教育实践活动整改方案
2014/09/23 职场文书
有限责任公司股东合作协议书
2014/12/02 职场文书
2014年校长工作总结
2014/12/11 职场文书
2014年工作总结及2015工作计划
2014/12/12 职场文书
通知范文怎么写
2015/04/16 职场文书
贫困证明书范文
2015/06/16 职场文书
【HBU】数据库第四周 单表查询
2021/04/05 SQL Server