js對象事件(訂閱/發布)


(function(){
    function EvtCenter(){
        this.index=1;
        this.ids=[];
        this.items={};
        this.channels={};
    }
    EvtCenter.prototype.getID=function(obj){
        var id,i;
        for(i=0;i<this.ids.length;i++){
            if(this.items[this.ids[i]]===obj){
                return this.ids[i];
            }
        }
        id = this.index++;
        this.ids.push(id);
        this.items[id]=obj;
        return id;
    }
    EvtCenter.prototype.getObj=function(id){return this.items[id];}

    function Eventable(fn){
        fn.prototype.on=function(center,name,callback){
            if(!(center instanceof EvtCenter))return;
            var channel=center.channels[name];
            var id=center.getID(this);
            if(!channel) center.channels[name]={};
            center.channels[name][id]=callback;
        }
        fn.prototype.off=function(center,name){
            if(!(center instanceof EvtCenter))return;
            var channel=center.channels[name];
            var id=center.getID(this);
            if(channel&&channel[id]){delete center.channels[name][id]}
        }
        fn.prototype.trigger=function(center,name,args){
            if(!(center instanceof EvtCenter))return;
            var self=this;
            var channel=center.channels[name];
            if(channel){
                for(var id in channel){
                    (function(obj,callback){
                        setTimeout(function(){
                            callback&&callback.call(obj,{sender:self,data:args})
                        },0)
                    })(center.getObj(id),channel[id]);
                }
            }
        }
    }

    window.EvtCenter=EvtCenter;
    window.Eventable=Eventable;
})();//event

原生事件只能綁定在DOM元素上,要想在任意Object上綁定事件,還得自己弄

我采用了訂閱發布模式

對象的識別上有點糾結,沒有像jquery那樣污染對象(添加uid),目前是用的對象緩存,然后遍歷,性能上肯定沒有直接添加uid好。。。

還要配合消息中心使用,有點小麻煩啊

(function(){
    var CENTER = new EvtCenter();
    function Obj(){
        this.on(CENTER,"load",this.onload)
    }
    Obj.prototype.onload=function(e){
        console.log('loaded');
    }
    Eventable(Obj);
    var obj=new Obj();
    function Loader(){
        var self=this;
        setTimeout(function(){
            self.trigger(CENTER,"load");
        },500)
    }
    Eventable(Loader);
    new Loader();
})()

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM