【面试】定时器时间到了但代码正在运行比较长的函数还没有执行完会怎样?

159 阅读1分钟

结论

定时器的回调函数需要一直等着,直到函数执行完毕,回调函数再开始执行。

先看一段代码

(function testSetTimeout() {
    const label = 'setTimeout';
    setTimeout(() => {
        console.log(label);
    }, 10);
    for(let i = 0; i < 10000000000; i++) {}
})();

在函数中,虽然我们设置了在10ms之后执行函数,但是实际上却是 12131ms,近千倍的差距就是因为主进程上还有没有执行完的任务。 下面我们进行相应的解析:

  • 首先在主进程上执行第一句代码。
  •  接着,遇到了setTimeout函数,异步执行。 即首先将异步执行的回调函数和这个事件放在任务队列里,然后将时间告诉给浏览器的定时模块。 
  • 然后迅速开始执行下面的for循环,由于这个循环很大,所以执行很久。在这个过程中, 浏览器的定时模块在10ms之后就开始把这个回调函数放在了主线程的执行队列中。
  • 但是主线程上的for还没有执行完毕,所以,回调函数就需要一直等着,直到for执行完毕,主线程队列上的回调函数开始执行。 所以时间有了一个很大的延迟。

欢迎关注

掘金:juejin.cn/user/415657…

Github:github.com/zhubingran

CSDN:blog.csdn.net/qq_43118757

QQ:1330022055