回调时,被回调的函数会被放在event loop里,等待线程里的任务执行完后才执行event loop里的代码。 因此,代码会先把线程里的执行完后,再执行event loop里的setTimeout函数.。
Event Loop
Wikipedia这样定义:
“Event Loop是一个程序结构,用于等待和发送消息和事件。(a programming construct that waits for and dispatches events or messages in a program.)”
为什么出现 Event Loop
JavaScript是一种单线程语言,所有任务都在一个线程上完成。一旦遇到大量任务或者遇到一个耗时的任务,比如加载一个高清图片,网页就会出现"假死",因为JavaScript停不下来,也就无法响应用户的行为。为了防止主线程的阻塞,JavaScript 有了 同步 和 异步 的概念。
同步:
如果在一个函数返回的时候,调用者就能够得到预期结果,那么这个函数就是同步的。也就是说同步方法调用一旦开始,调用者必须等到该函数调用返回后,才能继续后续的行为。下面这段段代码首先会弹出 alert 框,如果你不点击 确定 按钮,所有的页面交互都被锁死,并且后续的 console 语句不会被打印出来。
alert(‘Yancey’);
console.log(‘is’);
console.log(‘the’);
console.log(‘best’);
1
2
3
4
异步:
如果在函数返回的时候,调用者还不能够得到预期结果,而是需要在将来通过一定的手段得到,那么这个函数就是异步的。比如说发一个网络请求,我们告诉主程序等到接收到数据后再通知我,然后我们就可以去做其他的事情了。当异步完成后,会通知到我们,但是此时可能程序正在做其他的事情,所以即使异步完成了也需要在一旁等待,等到程序空闲下来才有时间去看哪些异步已经完成了,再去执行。
setTimeout(() => {
console.log(‘yancey’);
}, 1000);
for (let i = 0; i < 100000000; i += 1) {
// todo
}
1
2
3
4
5
6
7
这里需要等到 for 循环完成才会执行 settimeout,所以时间远远超过1000毫秒
事件循环机制 Event Loop
我们注意到,在异步代码完成后仍有可能要在一旁等待,因为此时程序可能在做其他的事情,等到程序空闲下来才有时间去看哪些异步已经完成了。所以 JavaScript 有一套机制去处理同步和异步操作,那就是事件循环 (Event Loop)。
用文字描述的话,大致是这样的:
1.所有同步任务都在主线程上执行,形成一个执行栈 (Execution Context Stack)。
2.而异步任务会被放置到 Task Table,也就是上图中的异步处理模块,当异步任务有了运行结果,就将该函数移入任务队列。
3.一旦执行栈中的所有同步任务执行完毕,引擎就会读取任务队列,然后将任务队列中的第一个任务压入执行栈中运行。
主线程不断重复第三步,也就是 只要主线程空了,就会去读取任务队列,该过程不断重复,这就是所谓的 事件循环。