前端手撕代码——手撕EventBus

// EventBus模式的优点

// 发布、订阅模式

// 创建EventBus类
class EventBus{
  // 构造函数  用于初始化listener对象
  constructor(){
    this.listeners = {};
  }

  on(event, listener){
    if(!this.listeners[event]){
      this.listeners[event] = [];
    }
    this.listeners[event].push(listener);
  }

  // 取消订阅事件,将事件
  off(event, listener){
    if(this.listeners[event]){
      const index = this.listeners[event].indexOf(listener);
      if(index > -1){
        this.listeners[event].splice(index, 1);
      }
    }
  }

  emit(event, ...args){
    //  用于触发事件,将事件和相关参数传递给对应的监听器
    if(this.listeners[event]){
      this.listeners[event].forEach(listener => listener(...args));
    }
  }
}


const bus = new EventBus();

bus.on('login', function(name){
  console.log('12313', name);
})

bus.on('login', function(name){
  console.log('1231223', name);
})

bus.emit('login', 1222313);

你可能感兴趣的:(前端手写代码,前端)