当前位置: 代码迷 >> 综合 >> 写一个EventEmitter类,包含on,emit,off,once方法
  详细解决方案

写一个EventEmitter类,包含on,emit,off,once方法

热度:0   发布时间:2023-12-21 03:51:16.0

EventEmitter类的核心:事件触发与事件监听器功能的封装
那么如何来手动写一个EventEmitter

class EventEmitter{
    constructor(){
    //在事件被创建或者实例化的时候调用此方法//注册一个空对象this.events = {
    }}//绑定事件函数on(type,callback){
    //首先判断这个事件是否存在if(this.events[type]){
    //如果存在的话直接给数组this.events[type]尾部添加回调函数this.events[type].push(callback)}else{
    //如果不存在则建立this.events[type] = [callback]}}//触发事件emit(type,...args){
    if(this.events[type]){
    //遍历数组,并且传值运算this.events[type].forEach(fn=>{
    fn(...args)})}}//停止监听某个事件off(type,callback){
    if(this.events[type]){
    //使用过滤器filter 如果fn和传入的callback相等的时候就删除它this.events[type]=this.events[type].filter(fn=>{
    fn !==callback})}}//单次监听器,只能被触发一次,下次触发就不会响应once(type,callback){
    let onlyOnce = function(...args){
    //执行此回调函数callback(...args)//执行完毕后关闭回调函数,就达到了一次性触发this.off(type,onlyOnce)}//绑定onlyOnce回调函数this.on(type,onlyOnce)}
}let e = new EventEmitter()
e.on('喝水时间到:',function(name){
    console.log(name+'该喝水了')
})
e.on('吃饭时间到:',function(name){
    console.log(name+'该吃饭了')
})
e.emit('喝水时间到:','蒋若依')
e.emit('吃饭时间到:','马强')

代码运算结果是:
在这里插入图片描述

  相关解决方案