On the execution order of Promise Asynchronous

setTimeout(() => {
  console.log(0)
})

new Promise(resolve => {
  resolve(1)
  Promise.resolve().then(t => {
    console.log(2)
  })
  console.log(3)
})
.then(t => {
  console.log(t)
})

console.log(4)

Why output 2 before 1? Instead of one and then two? Thank you very much for your answer!

Javascript
Sep.05,2021

once a pormise has a result, or already has a result, it generates a microtask for its callback. If a new microtask is added to the microtask queue during microtask execution, the new microtask is added to the end of the queue and then executed.

when executing resolve (1) , the code has not yet run to then (t = > {console.log (t)}) , and there is no callback at this time, so no micro tasks have been added at this time.

then execute Promise.resolve (). Then (t = > {console.log (2)}) , add a microtask for the inner Promise of the existing results, and then the outer Promise executes .then (t = > {console.log (t)}) , at which time the outer Promise belongs to the already existing results, so add a microtask for this callback.

the micro task of output 2 is in front of the micro task of output 1, so output 2 first and then output 1

in the case of resolve Synchronize calls, the order of execution here is related to the order of then (), regardless of the order of resolve (). 

https://mp.weixin.qq.com/s/VIoUDWq9212WsXweyfH5ZA

the concepts of JavaScript execution stack and message queue are involved here (check it out for yourself).

also understand the implementation principle of Promise. You can try to implement a Promise, yourself. There are also related articles. However, when simulating, setTimeout is also used to simulate. After all, it is impossible to really operate to the underlying execution stack and queue of js. The details may be different, but it is helpful to understand the principle.)

the following is an explanation:
when the promise.then (handle) is executed, the promise enters the waiting state, and when the result is available, it will push a task (that is, the handle) in the js message queue. When the other Synchronize code of js is finished (that is, the execution stack is idle), the first task handle, is read from the queue and executed in turn.

and if the promise returns the result immediately (Synchronize) after promise.then (handle) execution (Synchronize returns the result or the existing result), it will immediately push (handle), in the queue to wait for execution, and the order of push affects the order of execution.

the two .then (), in your question are returned by Synchronize, so the order of then () affects the order of push (), which in turn affects the order of execution. It has nothing to do with the order of resolve (). 

Promise.resolve().then(t => {console.log(2)})
:
Promise.resolve(undefined).then(handle)
"undefined" .then()handlepush

xxx.then(t => { console.log(t) })
resolve(1)1handlepush

Previous: Js or jq gets and overrides values under multiple elements

Next: How to use vue-cli when there is no external network and only npm image

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