基于JS原生的事件订阅和发布模式代码-CSDN博客

2019独角兽企业重金招聘Python工程师标准>>>

const event={
  //存放队列
  list:[],
  // 事件订阅
  listen:function(key,fn){
    if(!this.list[key]) {
      this.list[key] = [];
    }
    this.list[key].push(fn);
  },
  // 事件发布
  tirgger:function(){
    var key = Array.prototype.shift.call(arguments);
    var fns = this.list[key];
    // 如果没有订阅过该消息的话，则返回
    if(!fns || fns.length === 0) {
      return;
    }
    for(var i = 0,fn; fn = fns[i++];) {
      fn.apply(this,arguments);
    }
  },
  // 取消订阅
  remove:function(fn){
    var key = Array.prototype.shift.call(arguments);
    var fns = this.list[key];
    // 如果key对应的消息没有订阅过的话，则返回
    if(!fns) {
      return false;
    }
    // 如果没有传入具体的回调函数，表示需要取消key对应消息的所有订阅
    if(!fn) {
      fn && (fns.length = 0);
    }else {
      for(var i = fns.length - 1; i >= 0; i--) {
        var _fn = fns[i];
        if(_fn === fn) {
          fns.splice(i,1); // 删除订阅者的回调函数
        }
      }
    }
  }
}
var fn1 =function(color){
  console.log(color);
}
event.listen('test',fn1)
event.tirgger('test','red');
event.remove('test',fn1);
event.tirgger('test','block');

转载于:https://my.oschina.net/sunshineS/blog/1634693