观察者模式

通过观察者模式，我们可以将某些对象（观察者）订阅到另一个称为可观察对象的对象。每当事件发生时，可观察者都会通知其所有观察者！

一个可观察对象通常包含 3 个重要部分：

observers ：观察者数组，每当特定事件发生时就会收到通知
subscribe() ：一种将观察者添加到观察者列表的方法
unsubscribe() ：从观察者列表中删除观察者的方法
notify() ：每当特定事件发生时通知所有观察者的方法

然后，我们使用ES6 class创建一个可观察的对象。

typescript

type IEvent = (data: any) => any

class Observable {
  //定义一个事件数组
  private observers: Map<string, IEvent> = new Map()
  constructor() {}

  /**
   * 订阅,将事件添加到事件数组中
   * @param func
   */
  subscribe([name, fn]: [string, IEvent]) {
    this.observers.set(name, fn)
  }

  /**
   * 解除订阅,将指定事件从事件集合中移除
   * @param func
   */
  unsubscribe(name: string) {
    this.observers.delete(name)
  }

  /**
   * 通知订阅,遍历事件集合，依次调用事件达到触发所有订阅事件的功能
   * @param data
   */
  notify(data: any) {
    if (this.observers.size) {
      ;([...this.observers.values()] as IEvent[]).forEach((oberser) => oberser(data))
    }
  }
}

/**
 * 定义一个事件
 * @param data
 */
function $event1(data: any) {
  console.log('observer1', data)
}

/**
 * 定义一个事件
 * @param data
 */
function $event2(data: any) {
  console.log('observer2', data)
}

const observer = new Observable()

//订阅事件
observer.subscribe(['event1', $event1])
observer.subscribe(['event2', $event2])
//触发通知
observer.notify('数据变化了')

观察者模式 ​

观察者模式