js Event Loop

in 软件 with 0 comment

js事件循环
js本身执行是单线程的,也就是说当前代码执行的时候,是会阻塞其他代码执行的。
但是js的运行环境,譬如浏览器本身是多线程执行的,包括javascript引擎线程,界面渲染线程,浏览器事件触发线程,Http请求线程等。

一道经典的前端面试题

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

上面的程序会输出什么的呢?
答案是5个5(不行你自己试试^--^),那是为什么呢?
result.png
因为setTimeout的任务是异步的,js执行栈(JS引擎中负责解释和执行JavaScript代码的线程,可以成为主线程)在执行完js代码后,才会去从消息队列里面取消息、执行消息,再取消息、再执行。当消息队列为空时,就会等待直到消息队列变成非空。
所以上面的代码中,for循环执行完毕之后,setTimeout里头的回调函数才会被调用。那个时候i已经变成了5,因为放入了5个定时器,所以会输出5个5。

Responses