js中for迴圈閉包問題記錄

標籤：

<script type="text/javascript">
window.onload = function(){
var aImg = document.getElementsByTagName(‘img‘);

for(var i=0;i<3;i++){

　　　　alert(i); //0,1,2

　　aImg[i].onclick = function(){

　　　　alert(i);//3

　　　　}

　　}

　　　alert(i);//迴圈外值依舊為3

}

</script>
　　......以下內容省略.......

運行代碼之後發現紅色部分輸出的結果不同,這是因為js每執行一條迴圈語句隨著i的增加，在記憶體中會將此整個onclick匿名函數作為字串載入進記憶體，迴圈了3次所以i值變化為0,1,2當然匿名函數作為字串也被載入了3次(其實是函數還未被解析作為字串儲存於堆記憶體中，這裡載入的只是它的地址值，即aImg[0].onclick=address,aImg[1]=address,aImg[2]=address的點擊事件都指向同一個地址address)，當點擊事件觸發函數時會根據address找到觸發函數，由於函數中沒有i的定義，所以此時它會順著範圍鏈找到父級函數的i值，由於for迴圈不是一個塊級範圍，所以其i值相當於在window.onload匿名函數中聲明（在for迴圈結束時依然可以輸出i值），所以當onclick匿名函數找到i值時它已經變成了3.

js中for迴圈閉包問題記錄