javascript异步调用和单线程模型答案

【问题标题】：javascript asynchronous call and single threaded modeljavascript异步调用和单线程模型
【发布时间】：2015-10-17 16:31:25
【问题描述】：

在 javascript 时间线的执行阶段，会发生异步调用已注册事件处理程序的事件。根据我在异步调用方面的知识，程序执行不会等待任务完成，而是移动到下一个任务。那么谁能解释一下javascript如何处理注册到单个事件的2个事件处理函数的异步执行？

For eg:
    window.addEventListener("load",function(){console.log("onload event 1 called!");},false);
    window.addEventListener("load",function(){console.log("onload event 2 called!");},false);

javascript解释器是否只是调用第一个事件处理程序并转移到第二个事件处理程序，而第一个事件处理程序的执行部分由另一个线程执行？

我已经读到 javascript 遵循单线程模型，那么它如何适应？

【问题讨论】：

Are event handlers in JavaScript called in order?的可能重复
异步≠并行，这只是意味着你不会阻塞其余的应用程序，直到发生某些事情。此外，DOM 事件循环是在某种程度上阻塞：当一个事件触发时，所有的侦听器都会在其他任何事情发生之前被调用（特别是在任何其他事件可以被触发之前）。

标签： javascript asynchronous single-threaded

【解决方案1】：

根据我对异步调用的了解，程序执行不会等待任务完成，而是转移到下一个任务。

当您等待事件发生时会发生异步调用。 JavaScript 引擎继续执行其他任务，直到该事件触发异步回调。

javascript 解释器是否只是调用第一个事件处理程序并转到第二个事件处理程序

是的

第一个事件处理程序的执行部分由另一个线程执行

没有。这些功能是按顺序运行的，而不是同时运行的。

我已经读到 javascript 遵循单线程模型，那么它如何适应？

这会强制执行顺序操作。

【讨论】：

那么调用和执行的顺序是什么？
如我所说，它将按顺序运行函数。
@ronak_11 运行时基本上只是依次向每个处理程序发出函数调用。当一个处理函数返回时，运行时会移动到下一个。

【解决方案2】：

Javascript 是单线程的，因此任何时候都只有一段 javascript 代码在执行。但是浏览器本身是多线程的。您可以通过使用一些闪烁的 CSS 调用 javascript alert() 创建一个页面来验证这一点。即使 javascripts 等待用户单击“确定”，文本也会继续闪烁。

这也允许浏览器将事件排队，即使 javascript 线程已被占用。您可以使用以下代码验证是否属于这种情况：

function clickit()
{
    var start = Date.now();
    do
    {
    } while(Date.now() < start + 3000);
    console.log("done",start,Date.now());
}

...

<body onclick="clickit()"></body>

如果快速点击此页面，会产生以下结果：

done 1445104179091 1445104182091
done 1445104182098 1445104185098
done 1445104185099 1445104188099
done 1445104188099 1445104191099
done 1445104191099 1445104194099

如您所见，虽然在第一次点击之后，javascript 线程一直忙到 3 秒过去，但浏览器线程继续运行并能够将其他点击事件排队，然后在 clickit() 后立即执行函数结束。

在您的示例中，当页面加载时，浏览器线程将两个事件放入 javascript 的事件队列中。然后由于 javascript 处于空闲状态，它开始处理事件队列。它从顶部开始并处理第一个函数。然后当它完成时它会回到空闲状态，所以它会回到处理事件队列。此时第二个函数是顶部之一，所以它运行第二个函数。

【讨论】：