溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

async、await和promise的區(qū)別是什么

發(fā)布時(shí)間:2022-07-28 10:13:01 來源:億速云 閱讀:133 作者:iii 欄目:開發(fā)技術(shù)

這篇文章主要介紹“async、await和promise的區(qū)別是什么”的相關(guān)知識(shí),小編通過實(shí)際案例向大家展示操作過程,操作方法簡(jiǎn)單快捷,實(shí)用性強(qiáng),希望這篇“async、await和promise的區(qū)別是什么”文章能幫助大家解決問題。

    async

    async函數(shù)定義

    async函數(shù)是使用關(guān)鍵字聲明的函數(shù)。async 是“異步”的簡(jiǎn)寫,所以應(yīng)該很好理解 async 用于申明一個(gè) function 是異步的。

    作用

    用于解決:異步程序產(chǎn)生的bug

    ####async函數(shù)的語法

    async function name([param[, param[, ... param]]]) {
        statements 
    }

    參數(shù):name 函數(shù)名稱

    param 要傳遞給函數(shù)的參數(shù)的名稱

    statements 包含函數(shù)主體的表達(dá)式 ,可以使用await

    返回值: 一個(gè)全新的promise,這個(gè)promise要么會(huì)通過一個(gè)由async函數(shù)返回的值被解決,要么會(huì)通過一個(gè)從async函數(shù)中拋出的(或其中沒有被捕獲到的)異常被拒絕

    下面為async的具體使用實(shí)例:

     async function foo(p) {
            console.log("foo run",p);
            return 1;
          }
          var res = foo(1);
          console.log(res);//{<fulfilled>: 1}

    async函數(shù)一定會(huì)返回一個(gè)promise對(duì)象。如果一個(gè)async函數(shù)的返回值看起來不是promise,那么它將會(huì)被隱式地包裝在一個(gè)promise中。

    例如,如下代碼:

    async function foo() {
         //promise.[[promiseValue]] 
       return 1
    }
    //等價(jià)于
    function foo() {
       return Promise.resolve(1)
    }//{<fulfilled>: 1}

    下面是對(duì)async的一些補(bǔ)充:

    • async 本身是一個(gè)語法糖&mdash;>語法糖:帶有一定功能的關(guān)鍵字

      • 語法糖的作用:能夠減少代碼量、增加程序的可讀性,從而減少程序代碼出錯(cuò)的機(jī)會(huì)

    async 函數(shù)中 return 值如何接受

    方式一

    通過 promise.then-cb 形參獲取

     async function foo(){
                console.log(222222);
                return 123;
            }
    let res = foo();
     res.then(data=>{
                console.log(data);//123
            })

    方式二

    第二種接受函數(shù)返回值的方式是 await

      (async function (){
               console.log('async run');
               //第二種接受函數(shù)返回值的方式是 await
               let res = await foo();
               console.log(res);
           })()
     async function foo(){
               console.log('foo run');
               return 123;  
           }
     //res作用:接受 async foo函數(shù)返回值 是promise
    let res = foo();

    await

    await定義

    await 的意思是等待,所以應(yīng)該很好理解,await 等待某個(gè)操作完成。

    作用

    await關(guān)鍵字的作用 就是獲取 Promise中返回的內(nèi)容, 獲取的是Promise函數(shù)中resolve或者reject的值(await 作用是獲取promise.[[promiseValue]]的值)

    關(guān)于await的注意點(diǎn)

    • await 必須寫在 async 中

    • await 后是一個(gè)promise實(shí)例對(duì)象

    [[promiseValue]]

    [[PromiseValue]]是個(gè)內(nèi)部變量,外部無法得到,只能在then中獲取。

    [promiseValue]哪些能賦值

    • async函數(shù)的return

    • new promise 中 resolve實(shí)參

    • then 中 return (catch finally 中的return)

    • promise.reslove()實(shí)參 promise.reject()實(shí)參

    三者的區(qū)別

    • promise和 async/await都是解決異步編程的一種方式,但是async/await使得異步代碼看起來像同步代碼。

    • 函數(shù)前面多了一個(gè)async關(guān)鍵字。await關(guān)鍵字只能用于async定于的函數(shù)內(nèi)。async函數(shù)會(huì)隱式地返回一個(gè)Promise,該promise的resolve值就是return的值。

    為什么async/await更好?

    使用async函數(shù)可以讓代碼簡(jiǎn)潔很多,不需要像Promise一樣需要then,不需要寫匿名函數(shù)處理Promise的resolve的值,也不需要定義多余的data變量,還避免了嵌套代碼。

    async/await 讓 try/catch可以同時(shí)處理同步和異步的錯(cuò)誤。在下面的示例中,try/catch不能處理JSON.parse的錯(cuò)誤,因?yàn)樗赑romise中,我們需要使用.catch,這樣的錯(cuò)誤會(huì)顯得代碼非常的冗余。

    關(guān)于“async、await和promise的區(qū)別是什么”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí),可以關(guān)注億速云行業(yè)資訊頻道,小編每天都會(huì)為大家更新不同的知識(shí)點(diǎn)。

    向AI問一下細(xì)節(jié)

    免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

    AI