美文网首页
发布订阅模式

发布订阅模式

作者: 卷村队队员 | 来源:发表于2020-05-12 11:09 被阅读0次
    // 手写发布订阅模式 EventEmitter
          class EventEmitter {
            constructor() {
              this.events = {};
            }
            // 实现订阅
            on(type, callBack) {
              if (!this.events) this.events = Object.create(null);
    
              if (!this.events[type]) {
                this.events[type] = [callBack];
              } else {
                this.events[type].push(callBack);
              }
            }
            // 删除订阅
            off(type, callBack) {
              if (!this.events[type]) return;
              this.events[type] = this.events[type].filter(item => {
                return item !== callBack;
              });
            }
            // 只执行一次订阅事件
            once(type, callBack) {
              function fn() {
                callBack();
                this.off(type, fn);
              }
              this.on(type, fn);
            }
            // 触发事件
            emit(type, ...rest) {
              this.events[type] &&
                this.events[type].forEach(fn => fn.apply(this, rest));
            }
          }
    // 使用如下
          const event = new EventEmitter();
    
          const handle = (...rest) => {
            console.log(rest);
          };
    
          event.on("click", handle);
    
          event.emit("click", 1, 2, 3, 4);
    
          event.off("click", handle);
    
          event.emit("click", 1, 2);
    
          event.once("dbClick", () => {
            console.log(123456);
          });
          event.emit("dbClick");
          event.emit("dbClick");
    

    相关文章

      网友评论

          本文标题:发布订阅模式

          本文链接:https://www.haomeiwen.com/subject/vezvnhtx.html