在这里结合了单例模式写了一个发布订阅者模式。

    1. class MyEvent {
    2.   protected readonly store: { [key: string]: Function };
    3.   private static instance: MyEvent;
    5.   constructor() {
    6.     if (!MyEvent.instance) {
    7.       this.store = {}
    8.       MyEvent.instance = this
    9.     }
    10.     return MyEvent.instance
    11.   }
    13.   $on(type: string, callBack: Function) {
    14.     if (!this.store[type]) {
    15.       this.store[type] = callBack
    16.     }
    17.   }
    18.   $emit(type: string, data?: any) {
    19.     if (!this.store[type]) {
    20.       console.warn(`当前${type}没有被注册！`)
    21.     } else {
    22.       let fn = this.store[type]
    23.       fn(data)
    24.     }
    25.   }
    26.   $off(type: string) {
    27.     delete this.store[type]
    28.   }
    29. }
    31. let eve = new MyEvent()
    32. eve.$on("success",function(e){
    33.     console.log(e)
    34. })
    36. eve.$emit("success",{detail:"ok"})

    为了体现封装继承多态，还可以继承 MyEvent 添加自己的一些方法。

    1. class MyAddEvent extends MyEvent {
    2.   constructor() {
    3.     super()
    4.   }
    5.   getEventStore() {
    6.     console.log(this.store)    // 可以获取 父类的store
    7.   }
    8. }