for循环中执行console会立即执行,但是如果在for循环中使用setTimeout函数每隔一秒打印一次会怎么样呢。
众所周知,js是单线程的,主线程会执行同步任务,异步任务会被放入任务队列中,同步任务全部完成后再执行异步任务。而setTimeout是异步的,那么在for循环中使用setTimeout,会如何执行呢。
例如我们执行以下代码:
for (let i = 0; i < 10; i++)
{
setTimeout(function () {
console.log(1)
}, 3000);
}
执行结果:三秒后10个1一瞬间打印,并没有实现我们想要的每隔一秒打印一次
在这段代码中,“设置延迟函数setTimeout,每个延迟函数3秒后执行”这一过程执行了十次,所以执行结果为三秒后10个1一瞬间打印。
我们调整代码:
for(let i =0;i< 10;i++)
{
setTimeout(function () {
console.log(1)
}, i*1000);
}
设置时间为i*1000,打印第一个1花费了0*1000ms,打印第二个1花费了1*1000ms,打印第三个1花费了2*1000ms······这样子就达到了我们想要每隔一秒打印一次的需求。