观察者模式（发布-订阅者模式）

素颜马尾好姑娘i 2022-05-22 06:00 216阅读 0赞

观察者模式定义了一种依赖关系，解决了主体对象和观察者之间功能的耦合，主要应用于大型项目的模块化开发中，解决团队开发中模块之间的通信问题，利用观察者模式还可以实现自定义事件。

//观察者
    var Observer=(function(){
     var _messages={};
    return{
        //注册消息接口
        register:function(type,fn){ 
            if(typeof _messages[type]==="undefined"){
                _messages[type]=[fn];
            }else{
                _messages[type].push(fn);
            }
        },
        //发布消息接口
        fire:function(type,args){ 
            if(!_messages[type]){ 
                return;
            }
            var event={
                type:type,
                args:args||{}
            },
            i=0;
            len=_messages[type].length;
            for(;i<len;i++){
                _messages[type][i].call(this,event);
            }
        },
        //移除消息接口
        remove:function(type,fn){ 
            if(_messages[type] instanceof Array){ 
                var i=_messages[type].length-1;
                for(;i>=0;i--){
                    _messages[type][i]===fn && _messages[type].splice(i,1);
                }
            }
        }
    };
    })();

简单使用：

实例：  
实现提交消息后，在ul中插入一条消息，点击删除按钮，删除该消息，更改消息的数量。

共有<span id="msg_num">0</span>条消息
        <ul id="msg">
    
        </ul>
    
        <textarea id="user_text"></textarea>
        <button id="user_submit">提交</button>

![这里写图片描述][70]

[70]: /images/20220522/82df6dd2a4a74f87bda8da84ff37e639.png