Javascript事件队列是否具有优先级？

Question

这些天，我阅读了一些关于setTimeout和setInterval的文档。我了解到Javascript是一个单线程，每次只会执行一段代码。同时，如果有事件发生，它会被推送到事件队列中并阻塞，直到适当的时间。我想知道，当许多事件被阻塞等待同时执行时。这些事件是否具有不同的优先级，因此高优先级事件会在低优先级事件之前执行。或者只是一个FIFO队列。

setTimeout(fn1, 10);
$(document).click(fn2); //will be called at 6ms;
$.ajax({ajaxSuccess(fn3); //async request,it uses 7ms;})

 for () {
    //will run 18ms;
};

在上面的代码中，setTimeout fn1将在10 ms发生，Click事件处理程序fn2将在6ms发生，ajax回调fn3将在7ms发生，但所有三个函数都将被阻塞，直到for循环完成。在18ms，for循环完成，所以这些函数将被调用的顺序是什么。（fn1， fn2， fn3）或（fn2， fn3， fn1）

Answer 1

先进先出。真的没什么可说的了。你不能安排它。

当您看到可能同时发生的多个超时操作时，这可能会有点麻烦。也就是说，如果你使用异步行为，你不应该依赖于它们是如何被调度的。

Answer 2

javascript事件队列有优先级吗？

差不多吧。事件循环实际上由一个或多个事件队列组成。在每个队列中，事件按 FIFO 顺序处理。

由浏览器决定要有多少队列，以及给它们什么形式的优先级。对于单个事件队列或向特定队列发送事件，没有Javascript接口。

https://www.w3.org/TR/2014/REC-html5-20141028/webappapis.html#event-loops

每个任务都定义为来自特定的任务源。来自一个特定任务源并发往特定事件循环的所有任务（例如，由文档的计时器生成的回调，鼠标移动到该文档上而触发的事件，排队等待该文档解析器的任务）必须始终添加到同一任务队列中，但来自不同任务源的任务可以放置在不同的任务队列中。

例如，用户代理可以有一个用于鼠标和键事件的任务队列（用户交互任务源），另一个用于其他所有事件的任务队列。然后，用户代理可以在四分之三的时间内将键盘和鼠标事件优先于其他任务，保持界面响应但不使其他任务队列挨饿，并且永远不会无序地处理来自任何一个任务源的事件。

Answer 3

为主 JavaScript 线程安排的工作将处理 FIFO。这包括来自各种异步任务（如 setTimeout 和 ajax 完成）的回调，以及事件处理程序。唯一的例外是，在主要的流行环境（浏览器和Node）中，本机 Promise 的分辨率回调会跳过队列（更准确地说，进入不同的更高优先级队列），有关详细信息，请参阅我的答案。

但撇开本机 promise 解析回调不谈：

但是所有三个函数都将被阻止，直到 for 循环完成。在 18ms 时，for 循环完成，因此调用这些函数的顺序是什么。（fn1，fn2，fn3） 或 （fn2，fn3，fn1）

你给 setTimeout 的时间是近似值，因为当这个时间到来时，JavaScript UI 线程可能正忙于做其他事情（如你所知）;（newish）规范也有要求的最短时间，但它的执行程度因实现而异。同样，您不能保证单击事件将在 6 毫秒时排队，或者 ajax 完成将在正好在 7 毫秒处发生。

如果该代码开始，浏览器精确地执行了10ms，而< code>click事件恰好在6ms内排队，ajax请求恰好在7ms内完成，那么顺序将是:< code > fn2 (< code > click 处理程序)、< code > fn3 (Ajax完成)、< code > fn1 (< code > setTimeout )，因为这是它们排队的顺序。

但请注意，这些都是非常严格的时间安排。在实践中，我预计回调的排队顺序实际上是随机的，因为＜code＞单击

我认为这是一个更好的例子：

var start = +new Date();

// Queue a timed callback after 20ms
setTimeout(function() {
    display("20ms callback");
}, 20);

// Queue a timed callback after 30ms
setTimeout(function() {
    display("30ms callback");
}, 30);

// Queue a timed callback after 10ms
setTimeout(function() {
    display("10ms callback");
}, 10);

// Busy-wait 40ms
display("Start of busy-wait");
var stop = +new Date() + 40;
while (+new Date() < stop) {
    // Busy-wait
}
display("End of busy-wait");

function display(msg) {
    var p = document.createElement('p');
    var elapsed = String(+new Date() - start);
    p.innerHTML = "+" + "00000".substr(elapsed.length - 5) + elapsed + ": " + msg;
    document.body.appendChild(p);
}

输出的顺序将是两个循环消息，然后是10ms回调、20ms回调和30ms回调，因为这是回调排队等待主JavaScript线程服务的顺序。例如:

+00001: Start of busy-wait
+00041: End of busy-wait
+00043: 10ms callback
+00044: 20ms callback
+00044: 30ms callback

...其中，数字表示自脚本启动以来的毫秒数。