最近一直在做秋招的筆試題，EventEmitter居然出現過幾次了，說明它還是很重要的，就學了一下，JavaScript源代碼還是挺好理解的。

　　 對於Event事件大家應該都很熟悉，比如dom中的button，可以通過addEventListener/attachEvent（IE）添加click事件處理。而一般的object對象是沒有事件派發功能的，基於此需求，實現了一個EventEmitter。代碼如下：

 1 //JS源代碼
 2 function EventEmitter() {
 3     //存放事件和對應的處理方法
 4     this.handles = {};
 5 }
 6
 
 EventEmitter.prototype = {
 7     //傳入事件類型type和事件處理handle
 8     //實現事件訂閱on
 9     on: function(type, handle) {
10         if (!this.handles[type]) {
11             this.handles[type] = [];
12         }
13         this.handles[type].push(handle);
14         //console.log(handle);
15     },
16     emit: function
 
() {
17         //通過傳入參數獲取事件類型
18         var type = Array.prototype.shift.call(arguments);
19         if (!this.handles[type]) {
20             return false;
21         }
22         for (var i = 0; i < this.handles[type].length; i++) {
23             var handle = this.handles[type][i];
24             handle.apply(this
 
, arguments);
25             //console.log(arguments);
26         }
27     },
28     off: function(type, handle) {  
29         handles = this.handles[type];
30         if (handles) {
31             if (!handle) //不存在handle參數
32                 handles.length = 0; //清空數組
33         } else {
34             for (var i = 0; i < handles.length; i++) {
35                 if (handles[i] == handle)
36                     handles.splice(i, 1);
37             }
38         }
39     }
40 };

測試代碼：

 1 var em = new EventEmitter();
 2 em.on(‘mm‘,function (name) {
 3     console.log("mm:"+name);
 4 });
 5 em.emit(‘mm‘,‘哈哈哈哈‘);
 6 //console.log(em);
 7 console.log(‘===============‘);
 8  var p2 = new EventEmitter();
 9  var fn = function (name) {
10  console.log(‘mm2: ‘+ name);
11  };
12  var fn2 = function (name) {
13  console.log(‘mm222: ‘+ name);
14  };
15  p2.on(‘mm2‘, fn);
16  p2.on(‘mm2‘, fn2);
17  p2.emit(‘mm2‘,‘哈2哈2哈2哈2‘);
18  console.log(‘-------------‘);
19 p2.off(‘mm2‘, fn);
20 p2.off(‘mm2‘);
21  p2.emit(‘mm2‘,‘哈2哈2哈2哈2‘);
22  console.log(‘-------------‘);
23 p2.off(‘mm2‘);
24  p2.emit(‘mm2‘,‘哈2哈2哈2哈2‘);
25  console.log(‘-------------‘);

測試結果：

除此之外，node.js版本的EventEmitter也是很有用的。代碼如下：

 1 var eventEmitter = require("events");
 2 var myEmitter = new eventEmitter();
 3 myEmitter.on(‘begin‘, function() {
 4     console.log(‘begin‘);
 5 });
 6 myEmitter.on(‘begin‘, function() {
 7     console.log(‘begin2‘);
 8 });
 9 myEmitter.on(‘end‘, function() {
10     console.log(‘end‘);
11 });
12 myEmitter.emit(‘end‘); //end
13 //可以註冊多個同名事件，都會觸發
14 myEmitter.emit(‘begin‘); //begin begin2
15 console.log(myEmitter.eventNames()); //[ ‘begin‘, ‘end‘ ] ,同名的只輸出一個

EventEmitter事件派發器