《JS 函数的执行时机》

下面有一段代码，先想一下他的运行结果是打印 0、1、2、3、4、5还是6个6？

let i = 0
for(i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}

答案是6个6。

在解释为什么是6个6之前，先了解一下setTimeout函数的作用，举个形象点的栗子：

正当小明打游戏快推爆对面水晶的时候，他妈这时候叫他吃饭，这时候他先答应他妈马上去吃饭，接着又继续打一会直到游戏结束再去吃。这里的马上去就相当于setTimeout函数的机制，吃饭就是console.log(i),但实际上还是先完成当前的事情（即 for 循环）再去吃饭。

不过为什么会这样呢？这跟 JS 函数的执行机制有关， 要知道 setTimeout 是一个异步的函数， 那么这段代码的执行就变成了， 先走完整个循环，这时 i 已经变成了 6，才开始执行 6 个 console.log(i)，所以最终只会打印出 6 个 6。

换句话说， 函数什么时候开始调用，什么时候才开始查询参数的值。

那有没有什么办法能够解决这个问题， 我就想这样，然后还要打印出 0 1 2 3 4 5 。

有，只需要稍稍改变一下就可以了。

代码如下：

for(let i = 0; i < 6; ++i) {
	setTimeout(() => {
		console.log(i)
	}, 0)
}

只要把 let i = 0 放进 for 里面就可以实现了。这是JS为了迎合新手玩家而发明的方法。

那还有没有别的办法， 在 ES6 之前，还真有另外的两种方法，一种是利用 setTimeout 的第三个参数，另外一种是利用闭包。（关于setTimeout的第三个参数可参考该文章：www.cnblogs.com/wl0804/p/11…

// 第一种方法

for (var i=0; i<6; ++i) {
	setTimeout(function(i){
		console.log(i)
	}, 0, i)
}

// 第二种方法

for(var i=0; i<6; ++i) {
	!(function(j) {
		setTimeout(function(){
			console.log(j)
		}, 0)
	})(i)
}