2013-10-16 33 views
0

我在其中得到的回調函數的陣列和該函數設置的事件名稱的對象的成員函數:如何將'callbacks'數組參數傳遞給匿名函數?

... 
setHandlesByList: function (list) { 
    for (var i in list) { 
     var self = this; 
     $(document).on(list[i].name, function (e) { 
      list[i].callBack.call(self,e) 
     }); 
    }; 
}, 
... 

某處在子對象我有這個函數的調用父對象:

... 
initClass: function() { 
    this.setHandlesByList([ 
    { name: 'configChecked', callBack: onConfigChecked }, 
    { name: 'configExpired', callBack: onConfigExpired }, 
    ]); 
}, 
onConfigChecked: function() { 
    // some code 
}, 
onConfigExpired: function() { 
    // some code 
}, 
.... 

但不順心的事 - 所有事件的處理程序是最後一組回調函數...

+1

**哇是那個難以閱讀的縮進。 –

+0

您可以嘗試'$(document).on(list [i] .name,list [i] .callBack.bind(this))'或使用閉包,因爲您的當前impl有一個共享變量'i' 。 – PSL

+0

@PSL,'$ .proxy'是jQuery向後兼容的'Function.prototype.bind'實現,它還有一些對事件綁定有用的附加功能。 – zzzzBov

回答

2

你在這段代碼中創建的每個事件處理函數:

setHandlesByList: function (list) { 
    for (var i in list) { 
    var self = this; 
    $(document).on(list[i].name, function (e) { 
     list[i].callBack.call(self,e) 
     }); 
    }; 
}, 

...有持久參考listi,不複製它們的爲創建功能時的感覺。由於i最終是枚舉的最後一個屬性,所有處理程序最終引用相同的列表條目。

相反,創建一個生成器函數來創建回調(對不起,我不能重新使用縮進風格,我只是用一個相當標準的一個)

setHandlesByList: function (list) { 
    var self = this; 

    for (var i in list) { 
     $(document).on(list[i].name, buildHandler(list[i])); 
    }; 

    function buildHandler(entry) { 
     return function (e) { 
      entry.callBack.call(self,e) 
     }; 
    } 
}, 

現在,創建的函數關閉entry,該參數爲buildHandler調用,而不是listi。由於entry(參數)不會更改,因此處理程序可以工作。

請注意,我已將var self = this;從循環中移出,因爲它從迭代到迭代沒有變化,因此循環中沒有任何業務。


旁註:你曾經說過,該函數接收一個陣列。如果是這樣,for-in(沒有安全措施)不是循環訪問該數組中的條目的正確方法。更多:Myths and realities of for..in

3

嘗試以下操作:

setHandlesByList: function (list) { 
    for (var i = 0; i < list.length; i++) { 
     addCallback(list[i].name, list[i].callback); 
    } 
    function addCallback(on, name, callback) { 
     $(document).on(name, function(e) { callback.call(on, e); }); 
    } 
}, 

沒有您的作用域的一個問題,因爲i價值最終結束是的i的最後一個值時,你的回調進行評估。

另請注意,您可以使用list.forEach

相關問題