循环中使用闭包解决 var 定义函数的问题

1,198 阅读1分钟
经典面试题,循环中使用闭包解决 var 定义函数的问题

for ( var i=1; i<=5; i++) {
setTimeout( function timer() {
console.log( i );
}, i*1000 );
}


首先因为 setTimeout 是个异步函数,所有会先把循环全部执行完毕,这时候 i就是 6 了,所以会输出一堆 6。
解决办法有三种,第一种使用闭包

for (var i = 1; i <= 5; i++) {

(function(j) {

setTimeout(function timer() {

console.log(j);

}, j * 1000);})(i);}

第二种就是使用 setTimeout 的第三个参数

for ( var i=1; i<=5; i++) {

setTimeout( function timer(j) {

console.log( j );

}, i*1000, i);}

第三种就是使用 let 定义 i 了

for ( let i=1; i<=5; i++) {

setTimeout( function timer() {

console.log( i );

}, i*1000 );}

因为对于 let 来说,他会创建一个块级作用域,相当于

{ // 形成块级作用域

let i = 0

{let ii = isetTimeout( function timer() {

console.log( i );

},i*1000 );

}
i++

{let ii = i}

i++

{let ii = i}

...

}