Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
394 views
in Technique[技术] by (71.8m points)

js发现个奇怪的问题

for(let i=0;i<5;i++){
    setTimeout(function(){alert(i)},0)

  }
  
  这个输出的顺序是0,1,3,2,4
  不是0,1,2,3,4吗?

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

这个问题充分的体现了javascript单线程的特性

涉及的要点:

setTimeout向执行队列依次添加执行函数
let的局部作用域
alert 阻塞

首先,上述程序可以分解为以下的运行情况

这里将原问题修改为以下便于理解

for(let i=0;i<5;i++){
    setTimeout(function(){
        alert(i);
    },1000)
}

这是形成的队列

function _fun0() {
    alert(0);
}
function _fun1() {
    alert(1);
}
function _fun2() {
    alert(2);
}
function _fun3() {
    alert(3);
}
function _fun4() {
    alert(4);
}

假如将 alert 换做是 console.log那么问题就简单多了,控制台会依次的打印: 0,1,2,3,4。因为 console.log不会阻塞程序的运行

由于 alert 会阻塞程序的运行,假如等待2秒钟点击警告的确定按钮,导致延长该函数的时间线,执行 _fun1的时候本来花费的时间可以忽略不计,程序等待1秒中就可以执行 _fun2 ,但等待2秒之后,可以理解为超时,程序会直接跳过_fun2,而直接执行_fun3。以此类推。
之后的轮询再来处理剩下未执行的代码。

问题中 setTimeout(() => {}, 0),虽然时间间隔被设置为0,但是还是会有4ms的延迟,所以可以同上述一样理解

参考 《Javascript高级程序第三版》第22章 高级定时器

这个问题很好,但是却被减了两票,可惜了!


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...