搜索

首页  >  问答  >  正文

javascript - 关于setTimeout执行时间问题

A

    for (var i=5; i>=1; i--) { 
          setTimeout( function timer() {
              document.write(i+"<br />");
          }, i*3000 );
    }
    // 0 0 0 0 0
    // 保存执行后,3秒后弹出第一个console(0),之后隔3秒弹出第二个,依次按照时间执行。

A2

    for (var i=1; i<6; i++) { 
          setTimeout( function timer() {
                console.log(i);
          }, i*3000 );
    }
    // 6 6 6 6 6
    // 保存执行后,3秒后弹出第一个console(6),之后每隔3秒弹出一个,依次按照时间执行。

B

    for (var i=5; i>=1; i--) { 
          setTimeout( function timer() {
              document.write(i+"<br />");
          }, 3000 );
    }
    // 0 0 0 0 0 
    // 保存执行后,3秒后所有的console一齐弹出
    

C(采用闭包)

    for (var i=5; i>0; i--) { 
          !function (num) {
              setTimeout( function timer() {
                console.log(num);
              }, i*3000 );
          }(i)
    }
   // 1 2 3 4 5 每隔3秒依次弹出

问题:

1. A与A2中的时间设置中的i*3000i值为多少?(1?),为什么时间依旧是3000,没有和i值一齐计算?包括采用闭包后(C),依旧是每隔3000ms弹出。

2. A与B的区别?i*30003000console弹出的区别,这个区别在C闭包上也有体现。为什么会造成这样区别?

之前看到JS的队列执行结构,知道setTimeout这类函数是须等其他代码执行完毕后才开始执行,且存在多个setTimeout的话,按照时间设置长短,分配优先级(设置时间短的在前)。这里实在不知道为什么会有这样的区别,对它还是摸不透- -

for (var i=1;i<6;i++) { 
      !function (num) {
          setTimeout( function timer() {
            console.log(num);
          }, num*3000 );
      }(i)
}

依旧是每隔3秒弹出一个console,去掉num*则一齐弹出。相乘运算难道没执行?

滿天的星座滿天的星座2719 天前795

全部回复(2)我来回复

  • 欧阳克

    欧阳克2017-06-14 10:56:39

    1. setTimeout每隔3000ms弹出一个的话,时间不应该是3000,6000,9000,12000吗,你是不是跟setInterval搞混了。
      然后再说一点setTimeout(fn,time),这是个函数的执行,setTimeout的创建与主js是同步的(这个时候time的值就已经确定了),异步的是其中的fn的执行(执行的时候再去找内部的i或者num才会收闭包等的影响)。

    2. 站内搜一下event loop js应该有很多重复的问题和解释。

    回复
    0
  • ringa_lee

    ringa_lee2017-06-14 10:56:39

    setTimeout的延迟是相对于你运行它的那一刻,你这个for循环一股脑的把延迟全部设定好了,第一个相对当前3秒,第二个相对当前是6秒,第三个是9秒……以此类推。最后体现出来不就是每隔3秒一个输出吗……

    回复
    0
  • 取消回复