Node.js——事件的监听与触发
事件的监听与触发1、EventEmitter对象2、添加和触发监听事件2.1、添加监听事件2.2、添加单次监听事件2.3、触发监听事件3、删除监听事件1、EventEmitter对象在JavaScript中通过事件可以处理许多用户的交互比如鼠标的单击、键盘按键的按下、对鼠标移动的反应等。在Node.js中也提供了类似的事件驱动主要是通过events模块实现的该模块中提供了EventEmitter类用于处理事件。要使用EventEmitter类处理事件首先需要对其进行初始化代码如下EventEmitterrequire(events)eventEmitternewEventEmitter()在Node.js中可以添加监听事件的对象都是继承自EventEmitter对象后者提供了用于处理Node.js事件的方法常用方法及说明如表所示。方法说明addListener(eventName,listener)添加监听事件on(eventName,listener)添加监听事件与addListener()方法等效emit(eventName[,...args])触发事件setMaxListeners(limit)设置可以监听的最大回调函数数量removeListener(eventName,listener)删除指定名称的监听事件removeAllListeners([eventName])删除全部监听事件off(eventName,listener)删除指定事件名称的监听事件与removeListener()方法等效once(eventName,listener)添加单次监听事件prependListener(eventName,listener)将事件监听器添加到监听器数组的开头EventEmitter对象的addListener()方法和on()方法都用来添加监听事件它们的使用是等效的实际上on方法在内部实现时调用了addListener()方法。Node.js中推荐使用on()方法添加监听事件。使用EventEmitter对象创建简单事件。//引入events模块consteventsrequire(events);//生成EventEmitter对象letcustomnewevents.EventEmitter();//添加监听事件tickcustom.on(tick,(code){console.log(执行指定事件!);});//主动触发监听事件tickcustom.emit(tick);执行指定事件!上面的代码中使用EventEmitter对象添加监听事件和触发监听事件的代码都放在了一个文件中但实际应用时通常会把添加监听事件的模块和触发监听事件的模块分开。演示项目中监听事件的添加与触发。创建一个rint.js文件该文件中使用EventEmitter对象的emit()方法每隔1秒触发一次tick事件代码如下//定义变量用来记录执行次数letnum0;//引入events模块consteventsrequire(events);//生成EventEmitter对象exports.timernewevents.EventEmitter();//触发监听事件ticksetInterval((){num1;exports.timer.emit(tick,num);},1000);创建一个app.js文件为rint模块添加具体的tick事件该事件中输出一个日志信息代码如下//引入rint模块constrintrequire(./rint.js);//添加监听事件rint.timer.on(tick,(code){console.log(执行第${code}次监听事件);});执行第1次监听事件 执行第2次监听事件 执行第3次监听事件 执行第4次监听事件 执行第5次监听事件 执行第6次监听事件 ...2、添加和触发监听事件2.1、添加监听事件Node.js中添加监听事件使用的是EventEmitter对象的on方法该方法主要用来将回调函数添加到名为eventName的事件监听器数组的末尾其语法格式如下on(eventName,listener)eventName一个字符串表示事件名称。listener回调函数。在使用on方法向事件监听器数组中添加函数时不会检查其是否已被添加如果多次调用并传入相同的eventName与listener会导致listener被重复添加多次。例如下面代码会为tick事件添加3次同样的输出日志函数consteventsrequire(events);constcustomnewevents.EventEmitter();//添加监听事件tickcustom.on(tick,(){console.log(第1次添加!)});custom.on(tick,(){console.log(第2次添加!)});custom.on(tick,(){console.log(第3次添加!)});//触发事件custom.emit(tick);第1次添加 第2次添加 第3次添加从上面的运行结果可以看出在默认情况下事件监听器会按照添加的顺序依次调用但如果想要改变添加顺序该怎么办呢EventEmitter对象提供了一个prependListener方法该方法可以将事件回调函数添加到监听器数组的开头其语法如下prependListener(eventName,listener)eventName一个字符串表示事件名称。listener回调函数。consteventsrequire(events);constcustomnewevents.EventEmitter();//添加监听事件tickcustom.on(tick,(){console.log(第1次添加!)});custom.on(tick,(){console.log(第2次添加!)});custom.prependListener(tick,(){console.log(第3次添加!)});//触发事件custom.emit(tick);第3次添加! 第1次添加! 第2次添加!另外需要注意的是在上面的示例中我们可以为同一个事件添加多个回调函数但如果添加的回调函数超过10个则会出现警告提示。EventEmitter对象提供了一个setMaxListeners方法该方法用来设置可以监听的最大回调函数数量其语法格式如下setMaxListeners(limit)limit一个数字用来表示可以监听的最大回调函数数量。例如将监听器可以监听的最大回调函数数量设置为15个代码如下custom.setMaxListeners(15)2.2、添加单次监听事件使用前面介绍的on方法添加事件时事件一旦添加就会一直存在但如果遇到只想执行一次监听事件的情况使用on方法就无能为力了这时可以使用EventEmitter对象的once方法该方法用来将单次监听器listener添加到名为eventName的事件当eventName事件下次触发时监听器会先被移除然后再调用。once方法的语法格式如下once(eventName,listener)eventName一个字符串表示事件名称。listener回调函数。使用once方法添加单次监听事件。创建一个index.js文件其中使用EventEmitter对象的once方法为监听事件绑定一个回调函数然后使用emit方法触发该监听事件在触发时设置每秒触发一次代码如下//引入events模块consteventsrequire(events);//生成EventEmitter对象constcustomnewevents.EventEmitter();functiononUncaughtException(error){//输出异常内容console.log(发生异常请多加小心 !);}//添加监听事件eventcustom.once(event,onUncaughtException);//主动触发监听事件eventsetInterval(function(){custom.emit(event);},1000);使用once方法添加监听事件后每隔一秒触发一次该事件但只执行了一次。但是如果将代码中第10行的once修改为on则运行结果会变成每隔一秒输出一次日志。2.3、触发监听事件当对指定对象添加监听事件后需要触发添加的监听事件这时需要使用EventEmitter对象的emit方法其语法格式如下emit(eventName[,...args])eventName一个字符串表示要触发的事件名称。args回调函数中需要的参数。返回值布尔值表示是否成功触发事件。使用emit方法触发事件。创建一个index.js文件其中使用EventEmitter对象的on方法为监听事件绑定一个回调函数然后使用emit方法触发该监听事件代码如下//引入events模块consteventsrequire(events);//生成EventEmitter对象constcustomnewevents.EventEmitter();//添加监听事件eventcustom.on(event,functionlistener(){console.log(触发监听事件);});//主动触发监听事件eventcustom.emit(event);运行程序效果如下触发监听事件上面为事件添加的回调函数没有参数但在实际开发中可能需要定义带参数的回调函数这时使用emit方法触发监听事件时传入相应个数的参数即可。触发带参数的监听事件。创建一个index.js文件其中使用EventEmitter对象的on方法为监听事件绑定两个回调函数第一个回调函数有一个参数第二个回调函数的参数为不定长参数然后使用emit方法触发该监听事件代码如下//引入events模块consteventsrequire(events);//生成EventEmitter对象constcustomnewevents.EventEmitter();//添加监听事件eventcustom.on(event,functionlistener1(arg){console.log(第 1 个监听器中的事件有参数${arg});});//添加监听事件eventcustom.on(event,functionlistener1(...args){parametersargs.join(, );//连接参数console.log(第 2 个监听器中的事件有参数${parameters});});//主动触发监听事件eventcustom.emit(event,1,明日,年龄30,爱好编程);第 1 个监听器中的事件有参数 1 第 2 个监听器中的事件有参数 1, 明日, 年龄30, 爱好编程由于在第一个event事件中定义的回调函数中只有一个参数arg因此在触发时即使传入了多个值其也只输入第一个值在第二个event事件定义的回调函数中由于使用了“…args”进行定义这表示它是一个不定长参数因此在触发时会根据传入参数的个数输出相应的内容。3、删除监听事件删除监听事件的方法如下。removeListener(eventName,listener)删除指定名称的监听事件。removeAllListeners([eventName])删除全部监听事件。删除指定的监听事件。要添加到监听事件的回调函数单独定义并添加到event监听事件并触发在触发监听事件后使用removeListener方法删除该监听事件并通过输出删除前后的监听事件名称进行对比。代码如下//引入events模块consteventsrequire(events);//生成EventEmitter对象constcustomnewevents.EventEmitter();functionlistener(){console.log(触发监听事件);}//添加监听事件eventcustom.on(event,listener);//主动触发监听事件eventcustom.emit(event);console.log(custom.eventNames());//输出删除前的监听事件名称custom.removeListener(event,listener);//删除event事件console.log(custom.eventNames());//输出删除后的监听事件名称触发监听事件 [ event ] []在EventEmitter中还提供了off(eventName, listener)方法该方法实际上相当于removeListener方法的别名也可以删除指定名称的监听事件其使用方法与removeListener完全一样。在使用removeListener方法删除监听事件时如果同一个事件监听器被多次添加到指定eventName的监听器数组中则必须多次调用removeListener方法才能删除所有事件。//引入events模块vareventsrequire(events);//生成EventEmitter对象varcustomnewevents.EventEmitter();functionlistener(){console.log(触发监听事件);}//添加监听事件eventcustom.on(event,listener);/*多次添加同一个事件*/custom.on(event,listener);custom.on(event,listener);custom.on(event,listener);//主动触发监听事件eventcustom.emit(event);console.log(custom.eventNames());//输出删除前的监听事件名称custom.removeListener(event,listener);//删除event事件console.log(custom.eventNames());//输出删除后的监听事件名称上面代码中为event事件添加了4次listener回调函数但只使用removeListener删除了一次event事件触发监听事件 触发监听事件 触发监听事件 触发监听事件 [ event ] [ event ]删除前后event事件都存在说明使用removeListener并没有完全删除多次添加的event事件。这时如果想要完全删除event事件可以使用removeListener方法删除4次也可以直接使用removeAllListeners删除所有的监听事件代码如下custom.removeAllListeners(event);//删除所有event事件
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2469805.html
如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!