JavaScript观察者模式

观察者模式又叫发布订阅模式(Publish/Subscribe),它定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象,这个主题对象的状态发生变化时就会通知所有的观察者对象,使得它们能够自动更新自己。

使用观察者模式的好处:

  1. 支持简单的广播通信,自动通知所有已经订阅过的对象。
  2. 页面载入后目标对象很容易与观察者存在一种动态关联,增加了灵活性。
  3. 目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。
(function (w) {
    var topics = {}; // 回调函数存放的数组
    w.observer = {
        subscribe: function (name,fn) {
            if(!topics[name]){
                topics[name] = [];
            }
            topics[name].push(fn);
        },
        unsubscribe: function (name,fn) {
            if (!topics[name]) {
                return false;
            }
            for(var i = 0,l = topics[name].length;i < l;i++){
                if(fn == topics[name][i]){
                    topics[name].splice(i,1);
                    break;
                }
            }
        },
        publish: function (name,args) {
            if (!topics[name]) {
                return false;
            }
            setTimeout(function () {
                var subscribers = topics[name];
                var len = subscribers ? subscribers.length : 0;
                while (len--) {
                    subscribers[len](name, args);
                }
            }, 0);
            return true;
        }
    };
})(window);

测试代码
var fn1 = function(){console.log('fn1')};

var fn2 = function(){console.log('fn2')};

observer.subscribe('test',fn1 );

observer.subscribe('test',fn2);

observer.publish();
//fn2
//fn1

observer.unsubscribe('test',fn1);

observer.publish();
//fn2

posted @ 2017-02-14 13:56  minimal虾米  阅读(78)  评论(0编辑  收藏  举报