三句話總結 async await 用法

Anonymous1 發布于2019-08-23 18:06 / 1306人閱讀

摘要：三句話看懂函數執行結果都是總能等到結果即便是嵌套多層的異步的使用時必須在函數中表述可還清楚有遺漏請指正。

公司有個項目，類似用戶自定義試卷試題的功能，很多表單需要驗證，但是又要根據配置自動生成，所以，每個輸入框都是一個組件，驗證是異步，如果全部都用Promise看起來也很頭大，各方查閱，總結如下。

三句話看懂 async/await 1 async 函數執行結果都是Promise

async function HiAsync() {
 return "hi";
}
async function HelloAsync() {
 return Promise.resolve("hello")
}

console.log(HiAsync())
console.log(HelloAsync())

HiAsync().then(r => {
    console.log(r) // "hi"
})
HelloAsync().then(r => {
    console.log(r)  // "hello"
})

2 await 總能等到結果

(即便是嵌套多層的異步)

function getSomething() {
    return "a";
}

async function testAsync() {
    return new Promise((re, rj) => {
        setTimeout(() => { re("b") }, 500)
    })
}
async function deepAsync() {
    let p2 = new Promise((re, rj) => {
        setTimeout(() => { re("c") }, 10)
    })
    return new Promise((re, rj) => {
        setTimeout(() => { re(p2) }, 500)
    })
}

async function test() {
    const v1 = await getSomething();
    console.log("v1",v1)
    const v2 = await testAsync();
    console.log("v2",v2)
    const v3 = await deepAsync();
    console.log("v3",v3);
}
test();

3 await 的使用時必須在async 函數中

easy? 表述可還清楚？有遺漏請指正。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/104669.html

細說async/await相較于Promise的優勢

摘要：它細說了什么是函數，以及其相較于的優勢。從最早的回調函數，到對象，再到函數，每次都有所改進，但又讓人覺得不徹底。所以，不能把它和回調函數搭配使用。但不用寫及其回調函數，這減少代碼行數，也避免了代碼嵌套。總結的異步編寫方式，從回調函數到再到。前言介于上一篇「今日頭條」前端面試題和思路解析中提到的 async/await，讓我想起了之前寫過的一篇文章，在此做個分享。它細說了什么是a...

J4ck_Chan 2019-08-23 14:14 評論0 收藏0
js斷點調試心得（以chrome瀏覽器為例）

摘要：原文轉載自這里斷點調試心得我是勤勞的搬運工，嗯這里相對原文有刪減，想看原文的請移步。那么接下來犯罪嫌疑人的身份鎖定在哪里呢事件觸發了，那么接下來的問題就是它內部的函數問題了。這個功能非常的實用，大部分的調試都會使用到它。原文轉載自這里js斷點調試心得,我是勤勞的搬運工，嗯！這里相對原文有刪減，想看原文的請移步。 1、斷點調試是啥？難不難？用chrome瀏覽器打開頁面 → 按f12打...

Gu_Yan 2019-08-19 18:18 評論0 收藏0
Eventloop不可怕，可怕的是遇上Promise

摘要：就是每次傳入的函數最后是的任務之后，開始執行，可以看到此時會批量執行中的函數，而且還給這些中回調函數放入了一個這個很顯眼的函數之中，表示這些回調函數是在微任務中執行的。下一模塊會對此微任務中的插隊行為進行詳解。有關Eventloop+Promise的面試題大約分以下幾個版本——得心應手版、游刃有余版、爐火純青版、登峰造極版和究極變態版。假設小伙伴們戰到最后一題，以后遇到此類問題，都是...

olle 2019-08-23 16:28 評論0 收藏0
JS 異步編程六種方案

摘要：接下來介紹下異步編程六種方法。六生成器函數是提供的一種異步編程解決方案，語法行為與傳統函數完全不同，最大的特點就是可以控制函數的執行。參考文章前端面試之道異步編程的種方法你不知道的中卷函數的含義和用法替代的個理由前言我們知道Javascript語言的執行環境是單線程。也就是指一次只能完成一件任務。如果有多個任務，就必須排隊，前面一個任務完成，再執行后面一個任務。這種模式雖然實現起...

longmon 2019-08-23 14:42 評論0 收藏0
js的異步回調之async/await

摘要：假如返回的不是一個對象，是其他的任何返回值，后面的語句會立即執行。而關鍵字只有得到返回值后才繼續執行，不就是同步么。最近在學習NodeJS框架koa V2，koa2的API很簡單，基于ES7 async/await實現異步代碼。很多人認為async/await是解決異步終極解決方案，那我們就研究下async/await。前端業務邏輯越來越復雜，往往幾個 AJAX 請求之間互有依賴，有...

vspiders 2019-08-20 14:33 評論0 收藏0