观察者模式.md

JavaScript设计模式之观察者模式

概念

观察者模式，又被称为发布订阅模式，或者消息机制。定义了一种依赖关系，解决了主体对象和观察者之间功能的耦合

其实他就是定义了一种一对多的关系，让多个观察者对象同时监听某一个主体对象，这个主体对象的状态发生变化时，就会通知所有的观察者对象，使得他们能够自动更新自己。

观察者对象的好处：

• 支持简单的广播通信，自动通知所有已经订阅过的对象。
• 页面载入后目标对象很容易与观察者存在一种动态关联，增加了灵活性。
• 目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。

代码演示

js通过对观察者模式的实现是通过回调函数的方式

我们来先定义一个pubsub对象，其内部包含了3个方法：订阅、退订、发布

// 创建一个观察者
var Observe = (function() {
  var _message = {};
  return {
      register:function(type,fn) {
        //注册信息接口
        if(typeof _message[type] === 'undefined'){
            _message[type] = [fn];
        }else{
            _message[type].push(fn);
        }
      },
      fire:function(type,args) {
        //发布消息接口
        if(!_message[type]) return;
        //消息信息
        var event = {
            type:type,
            args:args||{}
        },
        i = 0,
        len = _message[type].length;
        for(;i<len;i++){
            //一次执行注册过的方法
            _message[type][i].call(this,event);
        }
      },
      remove:function(type ,fn) {
        //移除消息接口
        if(_message[type] instanceof Array){
            var i = _message[type].length-1;
            for(;i>-0;i--){
                _message[type][i] === fn && _message[type].splice(i,1);
            }
        }
      }
  }
})();


Observe.register('test',function(e) {
  console.log(e.type,e.args.msg);
});
Observe.register('test',function(e) {
  console.log(e.type,'Nealyang');
});

Observe.fire('test',{msg:'test test'});