JS event loop

setTimeout(() => { console.log(1) }, 1000)
new Promise(resolve => {
    setTimeout(() => { resolve(2) }, 1000)
}).then(data => {
    console.log(data); // then
});
console.log(3)

then

new Promise(resolve => {
    console.log("1");
    for(var i = 0; i < 1000; iPP) {
        i == 99 && resolve();
    }
    console.log("2");
}).then(function() {
    console.log("3");
})
console.log(4)
then1
Javascript
Mar.10,2022

then is executed only when the last resolve is received, so the output result will be

according to your code.

3Jing 1 Jing 2

The output of

3 is not to mention that the result of
Promise is a console, of settimeout, so the effects of 1 and 2 are the same, and the output results are 1, 2

according to the order of execution.

there is no loop, setTimeout is a timing function, it means that it will be executed in a few seconds, promise is a promise, and the function after then is executed in the promise function after it is executed. You can judge the execution order according to this idea. The execution result can be executed once in the console to know that

event loop refers to a mechanism, which is divided into macro tasks and micro tasks. The above code starts to execute, encounter setTimeout will put the callback function into the macro task queue, encounter new Promise, will first execute the constructor method, that is, setTimeout (() = > {resolve (2)}, 1000) , also put the callback function into the macro task queue, and then execute console.log (3) , output 3, and then first execute the micro task queue, found that there is no task inside, the end. At this point, a cycle is complete. Then start the next loop, execute the code in the macro task, that is, console.log (1) , output 1, and then scan the micro task to find no, end. Then start the third loop to execute the macro task, that is, resolve (2) , which adds the then method, that is, console.log (data); , to the promise task source, and then executes the micro task, outputting 2.
so loop 3 times, output 3, output 1, 2

it's time to find out this article again
https://juejin.im/post/59e85e.

Previous: I can't understand some of the notes in the jest test report.

Next: Use vue to write a message board that drives the picture, but when clicked, it is always the last message to drive the picture, not the latest one.

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu