最近的學(xué)習(xí)中遇到了觀察者模式，剛好之前買了《Javascript設(shè)計(jì)模式與開發(fā)事件》，于是翻到相關(guān)章節(jié)進(jìn)行學(xué)習(xí)。以下是學(xué)習(xí)之后的總結(jié)，希望能對看到的你有所幫助。

理解觀察者模式

1.指定發(fā)布者（比如售樓處）
2.給發(fā)布者添加一個(gè)緩存列表，向緩存列表存放回掉函數(shù)，用以通知訂閱者（想買房的人）
3.發(fā)布消息，發(fā)布者便利緩存列表，以此觸發(fā)里面存放的訂閱者回掉函數(shù)

例如一個(gè)Node.js 原生自帶 EventEmitter 模塊

EventEmitter 模塊，它是一個(gè)類，它的實(shí)例具有以下幾個(gè)方法：on、emit、off：

on(eventName, func)：監(jiān)聽 eventName 事件，事件觸發(fā)的時(shí)候調(diào)用 func 函數(shù)。
emit(eventName, arg1, arg2, arg3...)：觸發(fā) eventName 事件，并且把參數(shù)arg1, arg2, arg3... 傳給事件處理函數(shù)。
off(eventName, func)：停止監(jiān)聽某個(gè)事件。

class EventEmitter {
  /* TODO */
  constructor(){
    this.subList={}  //發(fā)布者
  }

  on(eventName,func){  
    if(!this.subList[eventName]){
     this.subList[eventName] = []   //是否有該訂閱者，如果沒有則添加
    }
   this.subList[eventName].push(func)   //向訂閱者列表添加回掉函數(shù)
  }

  emit(eventName, ... args){  
    var fns = this.subList[eventName]  
    if(!fns) return        //如果沒有該訂閱者，返回函數(shù)
    fns.map(cd => {        //存在該訂閱者時(shí)，遍歷列表觸發(fā)回掉函數(shù)
      cd(...args)
    })
  }

  off(eventName, func){
   var fns = this.subList[eventName]
    if(!fns || fns.length==0) return  
    var index = fns.indexOf(func)  
    fns.splice(index,1)   //將該事件從訂閱者列表中刪除
  }
}

未完待續(xù)