JS程式設計建議——73：函數綁定有價值

建議73：函數綁定有價值

函數綁定就是為了糾正函數的執行上下文，特别是當函數中帶有this關鍵字的時候，這一點尤其重要，稍微不小心，就會使函數的執行上下文發生跟預期不同的改變，導緻代碼執行上的錯誤。函數綁定具有3個特征：

函數綁定要建立一個函數，可以在特定環境中以指定參數調用另一個函數。

一個簡單的bind()函數接收一個函數和一個環境，傳回一個在給定環境中調用給定函數的函數，并且将所有參數原封不動地傳遞過去。

被綁定函數與普通函數相比有更多的開銷，它們需要更多記憶體，同時也因為多重函數調用而稍微慢一點，最好隻在必要時使用。

第一個特征常常和回調函數及事件處理函數一起使用。

var handler = {

};

var btn = document.getElementById('my-btn');

EventUtil.addHandler(btn, 'click', handler.handleClick); //undefined

出現上述結果的原因在于沒有儲存handler.handleClick()環境（上下文環境），是以this對象最後指向了DOM按鈕而非handler。可以使用閉包修正此問題：

EventUtil.addHandler(btn, "click", function(event) {

});

這是特定于這段代碼的解決方案。建立多個閉包可能會令代碼變得難于了解和調試，是以，很多JavaScript庫實作了一個可以将函數綁定到指定環境的函數bind()。

bind()函數的功能是提供一個可選的執行上下文傳遞給函數，并且在bind()函數内部傳回一個函數，以糾正在函數調用上出現的執行上下文發生的變化。最容易出現的錯誤就是回調函數和事件處理程式一起使用。

function bind(fn, context) {

}

在bind()中建立一個閉包，該閉包使用apply調用傳入的參數，并為apply傳遞context對象和參數。

注意：這裡使用的arguments對象是内部函數的，而非bind()的。在調用傳回的函數時，會在給定的環境中執行被傳入的函數并給出所有參數。

EventUtil.addHandler(btn, "click", bind(handler.handlerClick, handler));