jquery diary 6.5 javascript asynchronous mode (i)

Understanding jquery before implementing an asynchronous queue, it is necessary to understand the JavaScript asynchronous Pattern. JavaScript Async is not really a serious sense of asynchrony, JS makes certain fragments asynchronous way in the future, the stream does not have to wait to continue downward. The easiest way to think of async in a multithreaded language is to create a new thread in the current thread that allows a piece of code to execute in a newly created thread. This causes the current thread to continue down. And no matter what a book about JS book will tell us that JS is executed in a single-line thread, this thread is called the UI thread, from the name of the thread is not only used to execute the JS code, but also responsible for event processing and UI drawing. Maintain an event queue inside the viewer, The triggered events are put into this queue one after the other, and the UI thread spare to see the queue, assuming the queue is not empty, taking the first event and running its listener function.

for (var i = 0; i < 3; ++i) {    setTimeout (function () {         console.info (' setTimeout: ' + i);    }, 0);    Console.info (' For loop: ' + i)}

above this code in the UI thread of the run diagram such as the following

watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvc29uz3pozw5nxzc0mq==/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma== /dissolve/70/gravity/center ">
First put this section JS code to run in the UI thread, when the code runs to SetTimeout (FN, Mills), the viewer will put this timer event in the event queue 1, the previous said that only when the UI thread spare to run the timing event, but the JS code is still running, So continue for the For loop, I continue to increment, and continue to put in the timing event 2, 3, when the JS code fragment run completes, only then continue to run the timing events 1, 2, 3, the value of I is already 3. So in the console we see the print results are: settimeout:1, Settimeout:2,settimeout:3,for cycle: 3,for cycle: 3,for cycle: 3. In fact, this looks very similar to the traditional multithreaded asynchronous programming, the code runs the flow does not wait for the SetTimeout function to run to complete, Continue to run down. But what we have to understand is that in fact they still run serially, simply by putting the functions set in the settimeout in the queue, so that the JS code will still run first, and then run the performance in the event queue in turn.

Copyright notice: This article Bo Master original article. Blog, not reproduced without consent.

jquery diary 6.5 javascript asynchronous mode (i)