將獨特屬性與JavaScript中的匿名函數相關聯

Question

創建它們時，將唯一屬性與匿名JavaScript函數關聯的標準方式是什麼，以便這些屬性在執行時（即運行時）可以在函數內部進行訪問？

情景是這樣的：

說我有，我要綁定到動態生成的匿名函數的事件。

var events = ['connect','disconnect','error','connect_failed']; 

for(a in events){ 
    var handler = function(){ 
    // console.log(arguments.callee.custom); // Not reliable 'cos callee is supposedly deprecated 
    console.log('<event-name>'); 
    }; 
    handler.custom = events[a]; 
    $(window).on(events[a],handler); 
} 

由於使用arguments.callee的已被棄用，不保證在所有平臺上的最佳。推薦的方式是什麼？

Answer 1

您可以在函數中使用handler.custom，太：

var handler = function() { 
    console.log(handler.custom); 
    console.log('<event-name>'); 
}; 

爲了防止在異步回調的情況下範圍的問題，你可以通過在封閉包裝代碼中創建一個新的作用域handler功能：

for(a in events){ 
    (function() { 
    var handler = function(){ 
     console.log(handler.custom); 
     console.log('<event-name>'); 
    }; 
    handler.custom = events[a]; 
    $(window).on(events[a],handler); 
    })(); 
} 

編輯：剛纔意識到你也可以使用forEach（雖然也存在瀏覽器兼容性問題）：

events.forEach(function(event) { 
    var handler = function() { 
    ... 
    }; 
    handler.custom = event; 
    $(window).on(event,handler); 
}); 

Answer 2

我知道你的意思...... 你想要的事件名稱時，會觸發事件並想知道哪些事件函數引發了在運行時......是嗎？那麼你可以使用在處理接收到的事件對象... DEMO

var events = ['connect','disconnect','error','connect_failed']; 

for(a in events){ 
    var handler = function(e){ 
    console.log(e.type); 
     console.log('<event-name>'); 
    }; 
    $(window).on(events[a],handler); 
} 

for(a in events){ 
    $(window).trigger(events[a]); 
} 

Answer 3

你可以做這樣的事情：

var events = ['connect','disconnect','error','connect_failed']; 

function assignHandler(eventType, custom) { 
    $(window).on(events[a], function() { 
     console.log(custom); 
    }); 
} 

for(a in events){ 
    assignHandler(events[a], events[a]); 
} 

JS關閉神奇意味着匿名函數指定爲即使在assignHandler()完成後，assignHandler()中的事件處理程序也將能夠訪問custom參數assignHandler()。

不過，既然你似乎可以用jQuery的.on() method你不需要自己實現任何因爲jQuery已經有此功能：

.on(events [, selector ] [, data ], handler(eventObject)) 

注意可選的第三個參數是data。在事件處理程序中，可以按event.data訪問。

for(a in events){ 
    var handler = function(e){ 
    console.log(e.data); 
    console.log('<event-name>'); 
    }; 
    var custom = events[a]; 
    $(window).on(events[a], null, custom, handler); 
}