JavaScript 中的事件处理程序如何由事件循环处理

How do event handlers in JavaScript get processed by the event loop?

本文关键字：事件循环处理事件处理程序 JavaScript 更新时间：2023-09-26

我对浏览器如何处理JavaScript事件有点困惑。

假设我有两个事件处理程序附加到按钮 A 和 B。两个事件处理程序完成所需的时间完全相同。如果我先单击按钮 A，然后单击按钮 B，是否总是首先执行按钮 A 的事件处理程序（因为事件循环是 FIFO 队列），但何时完成是完全不可预测的？如果是这样，究竟是什么决定了这个顺序？

是的。事件处理程序的执行顺序是有保证的，在实践中它们不会重叠。

这就是事件循环作为并发模型的美妙之处。大多数时候，您不必考虑死锁、活锁和竞争条件等线程问题（尽管并非总是如此）。

执行

顺序很简单，浏览器中的JavaScript大部分时间都是单线程的，在实践中你不必担心事情的执行顺序。

然而，鼠标事件的顺序是有保证的，这与JavaScript几乎没有任何关系。这不是JavaScript语言的一部分，而是DOM API的一部分，DOM（文档对象模型）是JavaScript与浏览器和您编写的HTML交互的方式。

称为主机对象的东西在 JavaScript 规范中定义为浏览器中 JS 使用的外部对象，在这种情况下，它们的行为在 DOM API 中指定。

是否保证 DOM 事件的注册顺序不是 JavaScript 的一部分，而是该 API 的一部分。更具体地说，它就在这里定义。所以对于你的问题：是的，事件执行的顺序是确定的，除了控制键（如（控制alt delete）），这可能会弄乱评估顺序。

Javascript 引擎是单线程的。所有事件处理程序都是按顺序发生的;将调用 A 的单击处理程序，并在 B 的处理程序启动之前完成。您可以通过sleep()一个处理程序，并验证第二个处理程序在第一个处理程序完成之前不会启动来查看这一点。

请注意，setTimeout 对于此测试无效，因为它实质上向引擎注册了一个函数，以便稍后回调。 setTimeout立即返回。

此

小提琴应演示此行为。

当由javascript执行时，这些命令确实在FIFO中。但是，处理程序可能需要不同的时间来向您发送结果。在这种情况下，来自处理程序 B 的响应可能会更早返回，而来自处理程序 A 的响应可能会更晚。