- 資訊首頁(yè) > 開(kāi)發(fā)技術(shù) > web開(kāi)發(fā) > JavaScript >
- node.js如何自定義實(shí)現一個(gè)EventEmitter
最近做了商品批發(fā)的需求,需要針對不同的商戶(hù)選擇對應的批發(fā)商品回顯到原來(lái)的界面。由于該項目的代碼是公司古董級別(這種代碼都是程序猿的痛),解決問(wèn)題的時(shí)候都是小心翼翼的。為了避免這種問(wèn)題減少外部依賴(lài),手動(dòng)封裝事件派發(fā)的函數。
我們了解到,Node采用了事件驅動(dòng)機制,而EventEmitter就是Node實(shí)現事件驅動(dòng)的基礎
在EventEmitter的基礎上,Node幾乎所有的模塊都繼承了這個(gè)類(lèi),這些模塊擁有了自己的事件,可以綁定/觸發(fā)監聽(tīng)器,實(shí)現了異步操作
Node.js 里面的許多對象都會(huì )分發(fā)事件,比如 fs.readStream 對象會(huì )在文件被打開(kāi)的時(shí)候觸發(fā)一個(gè)事件
這些產(chǎn)生事件的對象都是 events.EventEmitter 的實(shí)例,這些對象有一個(gè) eventEmitter.on() 函數,用于將一個(gè)或多個(gè)函數綁定到命名事件上
Node的events模塊只提供了一個(gè)EventEmitter類(lèi),這個(gè)類(lèi)實(shí)現了Node異步事件驅動(dòng)架構的基本模式——觀(guān)察者模式
在這種模式中,被觀(guān)察者(主體)維護著(zhù)一組其他對象派來(lái)(注冊)的觀(guān)察者,有新的對象對主體感興趣就注冊觀(guān)察者,不感興趣就取消訂閱,主體有更新的話(huà)就依次通知觀(guān)察者們
const EventEmitter = require('events') class MyEmitter extends EventEmitter {} const myEmitter = new MyEmitter() function callback() { console.log('觸發(fā)了event事件!') } myEmitter.on('event', callback) myEmitter.emit('event') myEmitter.removeListener('event', callback);
基本代碼如下所示:
//事件派發(fā)機制 (function() { var EventDispatcher = function() { var EventDispatcherClosure = function() { }; EventDispatcherClosure.prototype = { /** * 注冊事件 * @param {Object} key * @param {Object} fn */ on: function(key, fn) { //獲取當前的事件對象 var curEvents = this._getCurEvents(key); //先檢查該事件是否已經(jīng)注冊過(guò)了 var flag = false; for (var i = 0, len = curEvents.length; i < len; i++) { if (curEvents[i].name == fn.name) { //已經(jīng)出現過(guò)了,以最新注冊的函數為主 flag = true; curEvents[i] = fn; break; } } if (!flag) { curEvents[curEvents.length] = fn; } this._register(key, curEvents); }, /** * 派發(fā)事件 * @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] || []; }, /** * 注冊時(shí)間 * @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(); })();
首先定義一個(gè)全局變量的匿名函數,然后將全局變量掛在window上面,這樣可以讓我們在開(kāi)發(fā)過(guò)程中的調用。在匿名函數的原型鏈上面添加事件分發(fā)、事件監聽(tīng)、事件刪除等方法。
事件分發(fā)的調用
EventDispatcher.dispatch("test", obj)
事件監聽(tīng)
EventDispatcher.on("test", function callback(obj) { })
事件刪除
EventDispatcher.on("test")
代碼封裝的比較簡(jiǎn)單
到此這篇關(guān)于node.js如何自定義實(shí)現一個(gè)EventEmitter的文章就介紹到這了,更多相關(guān)node實(shí)現EventEmitter內容請搜索腳本之家以前的文章或繼續瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng )、來(lái)自本網(wǎng)站內容采集于網(wǎng)絡(luò )互聯(lián)網(wǎng)轉載等其它媒體和分享為主,內容觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng),如侵犯了原作者的版權,請告知一經(jīng)查實(shí),將立刻刪除涉嫌侵權內容,聯(lián)系我們QQ:712375056,同時(shí)歡迎投稿傳遞力量。
Copyright ? 2009-2022 56dr.com. All Rights Reserved. 特網(wǎng)科技 特網(wǎng)云 版權所有 特網(wǎng)科技 粵ICP備16109289號
域名注冊服務(wù)機構:阿里云計算有限公司(萬(wàn)網(wǎng)) 域名服務(wù)機構:煙臺帝思普網(wǎng)絡(luò )科技有限公司(DNSPod) CDN服務(wù):阿里云計算有限公司 百度云 中國互聯(lián)網(wǎng)舉報中心 增值電信業(yè)務(wù)經(jīng)營(yíng)許可證B2
建議您使用Chrome、Firefox、Edge、IE10及以上版本和360等主流瀏覽器瀏覽本網(wǎng)站