手写JS观察者模式

观察者模式

$ 定义

当对象间存在一对多关系时，则使用观察者模式（Observer Pattern）。比如，当一个对象被修改时，则会自动通知依赖它的对象。观察者模式属于行为型模式。

• 观察者(订阅者) –Watcher
  • updata()当事件发生时,具体要做的事情
• 发布者 –Dep
  • subs数组存储所有的观察者
  • addSub()添加观察者
  • notify当事件发生,循环所有subs中的观察者的updata方法
• 没有事件中心(没有按事件分类,全部存储在一级数组中)
  • 观察者和被观察者，是松耦合的关系
  • 发布者和订阅者，则完全不存在耦合

$ 模拟观察者模式

//发布者
class Dep {
  constructor () {
    this.subs = []
  }
  addSub (sub) {
    if(sub && sub.updata){
      this.subs.push(sub)
    }
  }
  notify () {
    this.subs.forEach((element)=>{
      element.updata()
    })
  }
}
//观察者
class watch {
  updata() {
    console.log('观察者')
  }
}
const dep = new Dep()
dep.addSub (new watch())
dep.notify()