2011-11-17 85 views
0

我正在處理別人的代碼,並遇到了令人困惑的事情。通過字符串觸發綁定「函數」與調用函數

不是調用函數,而是調用綁定函數,然後通過字符串觸發它。

實施例1:

bind("hello.world", function(){ 
    console.log("hello world"); 
}); 

trigger("hello.world"); 

不是---

實施例2:

helloWorld = function(){ 
    console.log("hello world"); 
} 

helloWorld(); 

什麼是實施例1和實施例2之間的利弊謝謝。

+0

瞭解上下文會有所幫助,現在示例二並不真正有效。 –

回答

0

那麼,由於JavaScript是一個事件驅動的編程語言,我會推薦第一個。
下面是說明使用事件處理程序,而不是簡單的功能優點來電的情況下:

function someEventHandler(){ 
    if($(this).hasClass('some-class')) 
     // do something 
} 
$('element').bind('eventName.eventNamespace',someEventHandler); 

現在,如果你簡單地調用這個函數,例如:

someEventHandler(); 

,你可以看到它將不起作用,因爲它被設計成在dom元素上下文中執行。
如果觸發具有someEventHandler的功能,因爲它的事件處理程序的事件:

$('element').trigger('eventName.eventNamespace'); 

函數被調用的元素上下文,是這樣的:

someEventHandler.call($('element').get(0)); 

這將產生預期的效果。
此外,您可以將多個事件處理程序綁定到相同的事件並將其綁定到多個元素。
如果你想調用一個函數,每個DOM元素的列表,你將不得不做這樣的事情:

someEventHandler.call($('element1').get(0)); 
someEventHandler.call($('element2').get(0)); 
someEventHandler.call($('element3').get(0)); 
// ... and so on 

同時,與第一種方法會更容易:

$('element1,element2,element3').bind('eventName.eventNamespace',someEventHandler); 
$('element1,element2,element3').trigger('eventName.eventNamespace'); 

請注意,您採用的方法取決於您使用這些功能的上下文。如果你的函數與dom元素無關,或者你不希望更多的對象訂閱到你的事件中,你可能應該保持簡單並使用經典的函數聲明和調用。

+0

謝謝你的明確解釋。 – Ruby