js執行順序,Promise和async中的立即執行


1. js是單線程的,自上而下順序執行

2. 宏任務 微任務

js里有 seTimeout,setInterval,dom事件,ajax,Promise,process.nextTick(node.js才有的)等函數

Promise和async中的立即執行
我們知道Promise中的異步體現在then和catch中,所以寫在Promise中的代碼是被當做同步任務立即執行的。而在async/await中,在出現await出現之前,其中的代碼也是立即執行的。那么出現了await時候發生了什么呢?

await做了什么
從字面意思上看await就是等待,await 等待的是一個表達式,這個表達式的返回值可以是一個promise對象也可以是其他值。

很多人以為await會一直等待之后的表達式執行完之后才會繼續執行后面的代碼,實際上await是一個讓出線程的標志。await后面的表達式會先執行一遍,將await后面的代碼加入到microtask中,然后就會跳出整個async函數來執行后面的代碼。
由於因為async await 本身就是promise+generator的語法糖。所以await后面的代碼是microtask

 

 

Promise.resolve() 和 Promise.reject() 是手動創建一個已經 resolve 或者 reject 的 Promise 快捷方法。它們有時很有用。

 

Promise.all() 和 Promise.race() 是並行運行異步操作的兩個組合式工具。


promise 官方詳解在這里

執行順序詳解在大佬這里

 

幾個練習:

function test() {

console.log('a')

setTimeout(()=>{
    console.log('b')
})

new Promise((resolve, reject)=> {
console.log('c')
})

console.log('d')

}
test()

// 打印順序是:a c d b

 

 

function test() {

console.log('a')

setTimeout(()=>{
    console.log('b')
})

new Promise((resolve, reject)=> {
    console.log('c')
    resolve()
}).then(()=>{
    console.log('e')
}).catch(()=>{
    console.log('f')
})

console.log('d')

}
test()

// 打印順序是:a  c  d  e  b

 

 

function test() {

console.log('a')

setTimeout(()=>{
    console.log('b')
})

new Promise((resolve, reject)=> {
    console.log('c')
    resolve()
}).then(()=>{
    console.log('e')
    throw('err')
}).catch(()=>{
    console.log('f')
})

console.log('d')

}
test()

// 打印順序是:a  c  d  e  f b

 

 

 

.


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM