快速理解和使用 ES7 await async

2021-08-02 02:57:41 字數 1164 閱讀 4011

await/async 是 es7 最重要特性之一,它是目前為止 js 最佳的非同步解決方案了。雖然沒有在 es2016 中錄入,但很快就到來,目前已經在 es-next stage 4 階段。

傳統的寫法,無需解釋

// 獲取產品資料

ajax('products.json', (products) => );

});});

promise 已經被提及已久了,也是 es6 的一部分。promise 能消除 callback hell 帶來的厄運金字塔,相比起來**更清晰了,但還是達不到編寫同步**的直觀程度。

// promise

// 封裝 ajax,返回乙個 promise

function

requestp(url) );

});}// 獲取產品資料

requestp('products.json').then((products) => ).then((users) => ).then((comments) => );

generators 也是 es6 乙個新的特性,能夠 暫停/執行 **。yield 表示暫停,iterator.next 表示執行下一步,如果你不了解generators 也沒關係,可以忽略它直接學習 await/async。

// generators

function

request(url) );

}function *main()

var iterator = main();

iterator.next();

與 promise 結合使用

// 封裝 ajax,返回乙個 promise

function

requestp(url) );

});}(async () => ());

與 fetch api 結合使用:

(async () =>  catch (error) 

}());

再次結合 fetch

(async () => ());
使用 await/async 用同步的思維去解決非同步的**,感覺非常酷非常爽!

參考文獻[原文]:

快速簡單理解await 和 async 使用方法

這個函式用來處理非同步,它作為乙個關鍵字放到函式前面,用於表示函式是乙個非同步函式,因為async就是非同步的意思,非同步函式也就意味著該函式的執行不會阻塞後面 的執行。async test 呼叫的時候,直接用then 這裡可以看到async 修飾方法之後會返回乙個promise,就是處理非同步。a...

小結 ES7 async和await初識

async其實是es7才有有的關鍵字,async的意思是非同步,顧名思義是有關非同步的操作 async用於宣告乙個函式是非同步的。通常情況下async await都是跟隨promise一起使用,因為async返回值都是乙個promise物件,async適用於任何型別的函式上 使用async其實很簡單...

Git的快速理解 學習和使用

如果你是乙個剛開始學習開發小白的話,那麼你一定經常聽到git github,甚至gitlab。那麼什麼是git github gitlab呢?1.1 什麼是git github gitlab?git是乙個開源的分布式版本控制系統,可以有效 高速的處理從很小到非常大的專案版本管理,git 是 linu...