js鉤子函數

鉤子機制

鉤子機制是這樣的，你們按照某一規則寫一個方法（這個規則在方法名稱上），而後頁面加載完以前，統一執行全部的鉤子函數。

注意callHooks方法，裏面的局部變量s就是鉤子函數名稱中必定要有的內容。——這是使用鉤子的方法！

// 處理鉤子的對象var hook = (function(){
    return {
        timer:null,
        init:function(){
            this.callHooks('init');
        },  
        callHooks:function(init){
            var s = "hook_" + init + '_event',
            f = []; 
            for(var h in window){
                if(h.indexOf(s) != 0) continue;
                f.push(h);
            }   
            this.hooksTimeout(f);
        },  
        hooksTimeout:function(hooks){
            if(0 === hooks.length){
                if(this.timer) clearTimeout(this.timer);
                return;
            }   

            var h = hooks.shift();
            window[h].apply();
            window[h] = undefined;

            window.setTimeout(function(){hook.hooksTimeout(hooks);}, 200);
        }   
    }   
}());
// 鉤子1
var hook_init_event_tpl_html = function(){
    document.getElementById('test').innerHTML = 'This is HTML!';
}
// 鉤子2
var hook_init_event_tpl_console = function(){
    console.log('This is console!');
}
// 最好在頁面加載完以前調用，也就是在window.onload()以前
hook.init();