观察者模式

2019-04-14 19:50发布

1.定义

它定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象,这个主题对象的状态发生变化时就会通知所有的观察者对象,使得它们能够自动更新自己。 它是由两类对象组成,主题和观察者,主题负责发布事件,同时观察者通过订阅这些事件来观察该主体,发布者和订阅者是完全解耦的彼此不知道对方的存在,两者仅仅共享一个自定义事件的名称。 2>观察者模式的好处:
  1. 支持简单的广播通信,自动通知所有已经订阅过的对象。
  2. 页面载入后目标对象很容易与观察者存在一种动态关联,增加了灵活性
  3. 目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。
JS里对观察者模式的实现是通过回调来实现的 3>观察者模式发布/订阅模式的区别 1》本质上调度的地方不同 2》虽然两种模式都存在订阅者和发布者,但是观察者模式是由具体目标调度的,而发布/订阅模式是统一由调度中心调的,所以观察者模式的订阅者与发布者之间是存在依赖的,而发布/订阅模式则不会。     4>实例 浏览器的事件是观察者模式 div.onclick = function click() {  console.log('click') } function click是一个观察者监听div 的click 事件,当这个事件发生变化时,停止function click,让他执行。 实现自定义事件 Event 对象的接口 var Event={ //通过on接口监听事件eventName,如果事件eventName被触发则执行回调 on:function(eventName,callback){ if(!this.handles){ this.handles={} } if(!this.handles[eventName]){ this.handles[eventName]=[]; } this.handles[eventName].push(callback) }, //触发eventName emit:function(eventName){ if(this.handles[arguments[0]]){ for(var i=0;i