首頁 > 開發者 > JavaScript
複製代碼 代碼如下:
<body>
<input id="btnTest" type="button" value="Button"/>
<script type="text/javascript">
var handler={
message:"Event handled.",
handlerFun:function(){
alert(this.message);
}
};
document.getElementById('btnTest').onclick=handler.handlerFun;
</script>
</body>
上面的例子建立了一個handler對象，handler.handlerFun()方法被分配為DOM按鈕的click事件處理常式。設計意圖是這樣的：當點擊按鈕的時候觸發該方法，彈出對話方塊顯示handler定義的message，然而點擊後對話方塊內容卻是undefined。熟悉閉包的同學可以輕鬆看出來這個問題在於沒有儲存handler.handlerFun()方法的執行環境，this對象最後指向了DOM按鈕而非handler。可以使用閉包解決此問題，修改函數綁定語句
複製代碼 代碼如下:
document.getElementById('btnTest').onclick=function(){
handler.handlerFun();
}
這樣就可以得到預期的結果，這個解決方案在onclick程式內部使用一個閉包直接調用handler.handlerFun()方法，當然這是特定於此情境的解決方案，建立多個閉包可能會令代碼難以理解和調試。
自訂bind函數
複製代碼 代碼如下:
function bind(fn,context){
return function(){
return fn.apply(context,arguments);
};
}
document.getElementById('btnTest').onclick=bind(handler.handlerFun,handler);
通過自訂的bind函數可以將函數綁定到指定環境，bind()函數接收兩個參數：一個綁定函數，一個執行環境，並返回一個在執行環境中調用綁定函數的函數。看起來很簡單，但是其功能很強大，在bing()中建立了一個閉包，閉包使用apply()調用傳入的函數，並給apply()傳入執行環境和參數，這裡的arguments是內部匿名函數的，而非bind()的。當調用返回的函數時，它會在給定的函數中執行被傳入的函數，並給出所有參數。上面例子的調用handler.handlerFun依舊可以得到參數event，因為所有參數在都通過綁定的函數傳遞給它了。
小結
一旦要將某個函數以函數指標的形式傳遞，同時該函數必須在特定的環境中執行，自訂的bind()函數就可以使用，他們主要用於事件處理常式及setTimeout和setInterval,然而這種綁定方式和普通函數相比需要更多的記憶體開銷，所以盡量只在必要的時候使用。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
