JS single thread understanding notes - Original

One 、 what  JavaScript  A single thread ？

JavaScript  One of the characteristics of language is single thread , in other words , Only one thing can be done at a time . that , Why? JavaScript  There can't be more than one thread ？ This can improve efficiency .

JavaScript  The single thread , Related to its use . As a browser scripting language ,JavaScript  Its main purpose is to interact with users , And operation  DOM. This determines that it can only be a single thread , Otherwise, it will bring complicated synchronization problems . such as , Assume JavaScript  There are two threads at the same time , A thread in a  DOM  Add content on node , Another thread deleted this node , Which thread should the browser follow ？

therefore , To avoid complexity , From the birth ,JavaScript  It's a single thread , This has become the core feature of the language , It won't change in the future .

Two 、JavaScript A single thread , How to execute asynchronous code ？

Single thread means , All tasks are queued , The previous task is over , Will perform the latter task . If the previous task took a long time , The latter task had to wait .

Message queue ： Message queuing is a first in first out queue , It contains all kinds of messages .

The event loop ： Event loop means that the main thread repeatedly fetches messages from the message queue 、 The process of execution .

actually , The main thread does only one thing , It is to get messages from the message queue 、 Execution message , Message again 、 Re execution . When the message queue is empty , Will wait until the message queue becomes non empty . And the main thread can only execute the current message after , To get a message . This mechanism is called the event loop mechanism , The process of taking a message and executing it is called a loop .

3、 ... and 、 Event cycle mechanism

The above figure roughly describes ：

• When the main thread runs, it will produce an execution stack , The code in the stack calls some  api  when , They add various events to the event queue （ When the trigger conditions are met , Such as  setTimeout  completion of enforcement ）
• And the code in the stack is executed , It will read the events in the event queue , To execute those callbacks
• So circular

Be careful , Always wait for the code in the stack to execute before reading the events in the event queue