Some questions about the js event loop

there are some questions about the event loop mechanism of javascript. Js is a single-threaded language. During execution, asynchronous tasks will be placed in a separate task queue when asynchronous tasks are encountered. After the tasks in the main thread are completed, the event loop mechanism will put the completed asynchronous tasks into the main thread for execution.
events that are bound to the DOM element of the page (such as click events) are also asynchronous and need to be triggered before the corresponding code is executed, so what is the essential difference between such DOM events and asynchronous events (such as setTimeOut, ajax, etc.)? Is the trigger of DOM events also controlled by the event loop mechanism?

May.22,2021

the click you are talking about is precisely the subscription publisher pattern in the design pattern

it is more reasonable and clear to write asynchronous scenarios using subscription publisher mode

The

DOM event is essentially an EventEmitter (publish / subscribe mode). You need to register the event, and then you need to meet the conditions to trigger the event. There is no click event on a div itself, because you have registered the click event on it, and it will trigger when you click.
setTimeOut and ajax are api, that come with browsers. You can use them directly.


DOM events are both Synchronize and asynchronous.

< H1 > Synchronize < / H1 >

such as mouse events

We all know that after macrotask is executed, we need to check for microtask , and if so, execute microtask before executing macrotask . So as long as I know when the promise callback is executed, I know whether it is asynchronous or Synchronize.

name a chestnut
http://jsfiddle.net/631807682.

< H1 > Asynchronous < / H1 >

such as load event

< H1 > W3 document < / H1 >
Events may be dispatched either synchronously or asynchronously.

Events which are synchronous (sync events) are treated as if they are in a virtual queue in a first-in-first-out model, ordered by sequence of temporal occurrence with respect to other events, to changes in the DOM, and to user interaction. Each event in this virtual queue is delayed until the previous event has completed its propagation behavior, or been canceled. Some sync events are driven by a specific device or process, such as mouse button events. These events are governed by the event order algorithms defined for that set of events, and user agents will dispatch these events in the defined order.

Events which are asynchronous (async events) may be dispatched as the results of the action are completed, with no relation to other events, to other changes in the DOM, nor to user interaction.

DOM-Level-3-Events

Menu