我需要在 for循環中一次打印出 i 的 值。即0,1,2,3,4,5;
首次 書寫代碼
for(var i = 0;i<lg;i++){// lg = 6
setTimeout(function(){
console.log(i); //此時輸出爲 6 個 6
},1000)
}
我們想要的結果是在for循環中一次打印出 i 的 值。即0,1,2,3,4,5;但是輸出6個相同的個數字是什麼原因呢?
這主傳進去要是因爲setTimeout的執行時異步執行的,而for循環的執行卻非常的快,所以,在1s後執行定時器函數時, i 已經 循環到了最大值6,其他的i值已經被銷燬,此時再執行定時器,則是把 i=6傳進去了,所以造成了這樣的結果。
解決這個問題首先是要解決 i 值的變量銷燬問題,即瀏覽器的垃圾回收機制:
將延時器中的函數用一個自執行函數包起來,把每個循環中的 i 在被回收之前直接傳入到自執行函數中,這樣就可以避免被回收:如下:
for (var i = 0; i < lg; i++) {//lg = 6
(function(a){//自執行函數,獲取i
setTimeout(function() {
console.log(a);//操縱變量a,和i無關 此時輸出爲 0,1,2,3,4,5 且在1s延遲後輸出
}, a*1000)//將 i 的值傳進來 ,這樣就可以每個一秒輸出一個值
})(i)
}