http://cnodejs.org/topic/53f2b7af8f44dfa35140bca1javascript
本質就是一個函數棧的調用,在調用的時候傳如參數,相似一種鉤子,也像插件,可是插件是一個功能總體的擴展.html
裏面還提到了pipe 這個 在函數式編程中是一個很是形象有用的比喻.vue
補充一下關於鉤子:java
for(let f in window) {if(f == 'a')console.log(window[f])}node
var m = window.alert
window.alert = function(str){m('prefix: ' + str)}react
若是有個全局的函數或者變量是a 就能夠經過這種方式索引,注意變量和函數名相同都是能夠覆蓋的.jquery
https://segmentfault.com/q/1010000004335505?_ea=573129webpack
這裏其實就是利用了javascript 的函數能夠把引用存在變量中,等待一個合適的實際再調用的機制,web
調用能夠用call,apply,bind+調用等等.編程
var oriAlert = window.alert; window.alert = function(txt){ //改造函數 oriAlert(txt); }
參照:http://www.cnblogs.com/baochuan/archive/2012/06/11/2542048.html
// 處理鉤子的對象 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();
關於插件 我的以爲就是一種 全局擴展:
http://www.jb51.net/article/60419.htm jquery 插件編寫
我更有興趣的是vue,react,webpack,node 中的插件的編寫.