js自定義事件

自定義事件：js的自定義事件是用的觀察者的設計模式，有主體和觀察者兩部分組成，主體對象不在意是否有觀察者依然能夠運行，觀察者對主體動做觀察，當主體發佈事件後，觀察者捕獲事件後運行代碼（自我感受，是主體通知註冊的觀察者，告訴觀察者事件的發生）。下面以一個簡單的小例子來建立一個自定義事件

<script>
    (function(w){
        function MyEventTest(){  //主體對象
            this.mapHandlers = {};
            this.name = "";
        }
        //在原型鏈上建立，避免每次new再次建立
        MyEventTest.prototype = { 
            constructor : MyEventTest,
            
            addListener : function(type,handler){
               this.mapHandlers[type] = handler;
            },
            fire : function(event){
                if(!event.target){
                    event.target = this; //把主體對象綁定到event.target
                }
                this.mapHandlers[event.type](event);
            },
            setName : function(value){
                if(typeof value == 'string'){
                    this.name = value;
                    if(this.mapHandlers['afterSetName']){
                        this.fire({type:'afterSetName',name:value});
                    }
                }
            }
        };
        //綁定到window
        w.jQuery = w.$ = MyEventTest;
    })(window);
    
    var target  = new jQuery();
    //註冊監聽事件
    target.addListener('afterSetName',function(event){
        alert(event.name);
    });
    target.setName("小強");//setName會觸發註冊的事件
</script>