JS異步那些事 一 （基礎(chǔ)知識）
JS異步那些事 二 （分布式事件）
JS異步那些事 三 （Promise）
JS異步那些事 四（HTML 5 Web Workers）
JS異步那些事 五 （異步腳本加載）
分布式事件
PubSub模式
從原生的js角度塘慕，我們要監(jiān)聽某事件的方法就是利用addEventListener方法，但是當(dāng)我們的頁面趨于復(fù)雜，比如要向某個元素添加多個處理事件，那么就要用一個封裝函數(shù)匯集多個處理函數(shù)
link.onclick = function() {
clickHandler1.apply(this, arguments);
clickHandler2.apply(this, arguments);
};
在jquery中，jquery.on()方法使用的比較多走净，在新版的jquery中，也舍棄了bind（）方法，統(tǒng)一使用on绽媒，jQuery 將link 元素的事件發(fā)布給了任何想訂閱此事件的人。
Node.js中的EventEmitter 對象
要想給EventEmitter 對象添加一個事件處理器免猾，只要以事件類型和事件處理器為參數(shù)調(diào)用on 方法即可是辕。
emitter.on('evacuate', function(message) {
console.log(message);
});
emit（意為“觸發(fā)”）方法負(fù)責(zé)調(diào)用給定事件類型的所有處理器。舉個例子猎提，下面這行代碼：
emitter.emit('evacuate');
將調(diào)用evacuate 事件的所有處理器获三。
請注意，這里的術(shù)語事件跟事件隊列沒有任何關(guān)系。
使用emit 方法觸發(fā)事件時疙教，可以添加任意多的附加參數(shù)棺聊。所有參數(shù)均傳遞至所有處理器。
emitter.emit('evacuate', 'Woman and children first!');
事件名稱不存在任何限制贞谓，然而Node 相關(guān)文檔還是規(guī)定了一條有用的約定限佩。
實(shí)現(xiàn)一個PubSub模式
一個PubSub模型主要方法有3個，訂閱裸弦，退訂祟同，發(fā)布
<script type="text/javascript">
var PubSub = {};
// 用于儲存事件隊列
var queue = {};
// 訂閱接口
PubSub.on = function(event, cb) {
if (!queue[event]) {
queue[event] = [];
}
queue[event].push(cb);
};
// 退訂接口
PubSub.off = function(event, cb) {
var currentEvent = queue[event];
var len = 0;
if (currentEvent) {
len = currentEvent.length;
for (var i = len - 1; i >= 0; i--) {
if (currentEvent[i] === cb) {
currentEvent.splice(i, 1);
}
}
}
};
// 發(fā)布接口
PubSub.emit = function(event) {
var currentEvent = queue[event];
if (currentEvent) {
for (var i = 0; i < currentEvent.length; i++) {
currentEvent[i]();
}
}
};
</script>
####使用
<script type="text/javascript">
// 訂閱
var callbackA = function () {
console.log('event a happened')
};
PubSub.on('a', callbackA);
PubSub.on('b', function() {
console.log('event b happened')
});
// 退訂 , 第二個參賽傳入回調(diào)函數(shù)的引用
PubSub.off('a', callbackA);
// 發(fā)布
PubSub.emit('a');
PubSub.emit('b');
</script>
挖個坑 ，找一下jquery.on()的源碼烁兰，看一下它自定義事件的實(shí)現(xiàn)
PubSub模式不適用在一次性的事件中耐亏，，如果是用Promise的話就比較適合一次性的事件沪斟。
關(guān)于分布式事件广辰，也可以參考一下angular.js的雙向數(shù)據(jù)綁定的實(shí)現(xiàn)，
angular.js的雙向數(shù)據(jù)綁定
