1. Preamble
We have heard about the concept of synchronous processing and asynchronous processing many times. So what is the concept and the difference between sync and asnyc?
In a nutshell, when synchronizing code processing will be run sequentially in pre-written order, when handling asynchronously, when the code below can still run even though the above code has not been completely processed. .
2. An illustration of synchronous processing.
Let us think of the following example:
- Mr. X is a wise person, can solve and answer everything.
- Would you like to ask Mr. X answer or solve something, call him directly (note that this is the only way to contact).
- Whenever receiving a request, Mr. X will answer immediately.
- So, if you want to solve anything, just pick up the phone to call Mr. X and hear the answer right away, so the job is done.
This is probably the most obvious picture of synchronized processing (sequential processing) in practice: First, you ask, Mr. X listens, after receiving the request you listen to the answer from Mr. X, done !!! But if so, where does the problem arise ??? 
2.1 When the synchronization problem
Mr.X can handle everything, so the number of people asking is increasing when: when you call Mr.X, you will receive a busy notification and do not know when Mr.X is free to be able to call back to avoid the situation that you have to call again many times to meet the professor, Mr.X devises a solution instead of calling directly, the professor will receive a reply via text message.
- The professor hired Mr. Xo (called Mr. M) to manage the delivery of messages. Messages to Mr. X will be arranged in the correct order of submission.
- All processing requests will now be sent to Mr. Xo, Mr. M’s mission. M is managing messages and giving each message in turn to Mr. X to solve, so on, one by one hand to handle Mr. X when the old message has resolved.
- So, once Mr. When X receives your request, your name will be mentioned (called) so you can listen to the answer.
So is this type of processing synchronous or asynchronous?
The answer is: Both
When you send a request, your request has not been processed immediately, you have not received the results, but you can still send another message, that is asynchronous in the direction of the request.
However, when Mr. X is replying to your message, and at the same time you are listening, it processes synchronously in responding to each message .
3. Javascript – A language of asynchronous processing
When someone says Javascript is an asynchronous processing language, it is most likely that they are referring to the mechanism of sending messages. Indeed, in javascript the function will never be called and will be handled directly through messages.
The internal processing engine of javascript consists of the following main components:
- A message queue. The message queue receives the called processes, each of which is called as the corresponding message in the queue.
- A loop ( Event-loop ) Event-loop is responsible for coordinating the taking of existing messages in the queue: each time it will take 1 message out of the queue to be processed , during processing the event-loop will wait until the old message is processed. After processing, then continue to get new messages in the queue to process, and so on and so forth.
- Stack handling (call stack). The call-stack is a stack that manages the function execution and calls the nested function, ie: For each function that has just been removed from the queue to be processed, it will correspond to a frame in the call. -stack, if there are more sub-functions within this function, these functions will be added to the call-stack as a new frame of the stack . And Javascript will handle this call-stack in the form of first-in last-out (stack processing), until the stack is empty, it is considered that the message has been processed.
The following drawing will help you better visualize this: 
It can be seen that, for each message waiting in the queue, it will have to wait until the call stack is completely empty before the Event-loop will take another message in the queue to process, and the new message will retrieve it. corresponds to a new frame in the call-stack.