爲什麼this.name未定義？

Question

爲什麼this.name返回undefined？

function EventEmitter() { 
    var events = {}; 
    this.name = "Google" 
    this.on = function(name, fn) { 
    events[name] = events[name] || []; 
    events[name].push(fn); 
    } 
    this.trigger = function(name, args) { 
    events[name] = events[name] || []; 
    args = args || []; 
    events[name].forEach(function(fn) { 
     fn.apply(this, args); 
    }); 
    } 
} 

var my_event_emitter = new EventEmitter(); 
my_event_emitter.on('curtain_dropped', function() { 
    console.log(this.name); 
}); 
my_event_emitter.trigger('curtain_dropped', [true]); 

當我打電話fn.apply(this, args)是EventEmitter的this不是實例是my_event_emitter？

Answer 1

的forEach都有自己的內容。使用的3種方式之一新的上下文綁定，如：

events[name].forEach(function(fn) { 
    fn.apply(this, args); 
}.bind(this)); 

您也可以通過（如2對Arg的的forEach）上下文。回調的參數是（value，index，originalArray，context）;

events[name].forEach(function(fn) { 
    fn.apply(this, args); 
},this); 

Answer 2

否; this是您的forEach回調被調用的上下文。
默認情況下，這是全局對象。

你需要第二個參數傳遞給forEach()告訴它應該在其回調什麼this。

Answer 3

由於下面的代碼行：

events[name].forEach(function(fn) { 
    fn.apply(this, args); 
}); 

當你調用apply，你給錯了this參考，因爲你是forEach閉包內。

如果你想提供this的EventEmitter實例的引用，您需要將其存儲在一個變量，並使用它的閉包：

function EventEmitter() { 
    var events = {}; 
    var that = this; // <-- Current instance reference! 
    this.name = "Google" 
    this.on = function(name, fn) { 
    events[name] = events[name] || []; 
    events[name].push(fn); 
    } 
    this.trigger = function(name, args) { 
    events[name] = events[name] || []; 
    args = args || []; 
    events[name].forEach(function(fn) { 
     fn.apply(that, args); // Provide "that" instead of "this" 
    }); 
    } 
}