What Is an Event Loop?

In the field of computers, the definition of an event ring, or message dispatcher, message ring, message pump, or operation ring, is nothing more than a program structure used to wait for and distribute events or messages in a program. It works by making a request to an internal or external "event provider" (usually blocking requests until an event occurs), and then calling the corresponding event handler (also known as "distribution of events"). The event loop is usually combined in the programming design mode "reactor mode", provided that the event provider follows the same file interface, so that the event provider can be selected, 'Polled' (this is called passively in Unix systems, now It can also be called polling directly.) The event loop almost always performs asynchronous operations on the message sender.

The main purpose of JavaScript is to interact with the user and manipulate the DOM. If JavaScript has two threads at the same time, one thread adds content to a certain DOM node, and the other thread deletes this node ^[1]

The main thread reads events from the task queue. This process is continuous, so the entire operation mechanism is also called Event Loop.

  function readi
 console. log (1)
 setTimeout (function ((
 console. log (2)
 console. log (3);
 reado

Analysis: SetTimeout () means that after the current code is executed (the execution stack is cleared), the specified callback function is executed immediately (0 millisecond interval).

In addition to generalized synchronous and asynchronous tasks, we have a more refined definition of tasks:

Macrotask:

• setImmediate: put the callback function at the end of the event queue

• setTimeout: timer

• setInterval: timer

Microtask):

• process.nextTick: put the callback function at the bottom of the current execution stack

• Promise:

The order of the event loop determines the execution order of the js code. After entering the overall code (macro task), the first cycle is started. Then all micro tasks are executed. Then start from the macro task again, find one of the task queues and then execute all the micro tasks.

JS is single-threaded, which means that tasks need to be executed one after the other in order. This is because JS as a browser-side scripting language initially began to interact with users and manipulate the DOM. If JS has two threads, one adds If the DOM is deleted, it will inevitably have unpredictable consequences, so single-threaded is more suitable. However, this method has a disadvantage. It must wait for the previous program to complete before executing the next one, so the program is divided into Two types: synchronous tasks and asynchronous tasks. In the execution stack of JS, synchronous tasks enter the main execution stack (also called the main thread), while asynchronous tasks enter the task queue (TaskQueue) waiting for execution. The task queue can be understood as a message queue, and the I / O device completes one thing. Add an event to the task queue. Once all the synchronous tasks in the main execution stack have been executed, the tasks waiting in the task queue will be read and put into the execution stack to start execution. In fact, it is a callback function to execute asynchronous tasks, so It is said that an asynchronous task must specify a callback function, and the main thread will continuously cycle this action, so this operation mechanism is also called EventLoop (event loop).