ES8(13)、await 和 async 的用法

async函數(shù)是使用async關(guān)鍵字聲明的函數(shù)。 async函數(shù)是AsyncFunction構(gòu)造函數(shù)的實(shí)例, 并且其中允許使用await關(guān)鍵字。asyncawait關(guān)鍵字讓我們可以用一種更簡(jiǎn)潔的方式寫(xiě)出基于Promise的異步行為,而無(wú)需刻意地鏈?zhǔn)秸{(diào)用promise。

1、先簡(jiǎn)單回顧一下Promise用法

function 搖色子(){
  return new Promise((resolve,reject)=>{
    setTimeout(()=>{
      let n=parseInt(Math.random()*6+1,10) //1~6的隨機(jī)數(shù)
      resolve(n)
    },1000)
  })
}

搖色子().then(
   x=>{
     console.log("色子的點(diǎn)數(shù)是"+x);
   },
   ()=>{
     console.log("搖色子還能失?。?);
   },
)

2、上面采用鏈?zhǔn)?code>.then調(diào)用promise,現(xiàn)在改用用async函數(shù)

function 搖色子(){
  return new Promise((resolve,reject)=>{
    setTimeout(()=>{
      let n=parseInt(Math.random()*6+1,10) //1~6的隨機(jī)數(shù)
      resolve(n)
    },1000)
  })
}

async function test(){
  let n=await 搖色子()  //await不能直接使用,必須要用async 聲明的函數(shù)包裹才能使用,否則報(bào)錯(cuò)
  console.log(n)
}

test()

3、改用了async...await,如果要打印出錯(cuò)誤信息可以結(jié)合try...catch使用

function 猜大小(猜測(cè)){
  return new Promise((resolve,reject)=>{
    console.log("開(kāi)始搖色子")
    setTimeout(()=>{
      let n=parseInt(Math.random()*6+1,10) //1~6的隨機(jī)數(shù)
      if(n>3){
        if(猜測(cè)==="大"){
          resolve(n);
        }else{
          console.log('error')
          reject(n)
        }
      }else{
        if(猜測(cè)==="小"){
          resolve(n);
        }else{
        console.log('error')
        reject(n)
        }
      }
      resolve(n)
    },1000)
  })
}

async function test(){
  try{
    let n=await 猜大小("大")
    console.log("中獎(jiǎng)了"+n)
  }catch(error){
    console.log("輸光了"+error)
  }
}

test()

4、但是async...await也有自己局限性,例如還是上面例子,如果我要同時(shí)進(jìn)行兩次猜色子游戲,

(1)、用鏈?zhǔn)?code>.then寫(xiě)法:引用Promise.all這個(gè)API

Promise.all([猜大小('大'),猜大小('大')])  //引用Promise.all這個(gè)API,兩者都成功才會(huì)執(zhí)行
  .then((x)=>{console.log(x)},(y)=>{console.log(y)})

(1)、用async...await寫(xiě)法:還是引用Promise.all這個(gè)API

async function test(){
  try{
    let n=await Promise.all([猜大小('大'),猜大小('大')]) 
    console.log("中獎(jiǎng)了"+n)
  }catch(error){
  console.log("輸光了"+error)
  }
}

test()

4、使用async...await返回值依舊是一個(gè)Promise,這個(gè)promise要么會(huì)通過(guò)一個(gè)由async函數(shù)返回的值被解決,要么會(huì)通過(guò)一個(gè)從async函數(shù)中拋出的(或其中沒(méi)有被捕獲到的)異常被拒絕。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 一、async/await的優(yōu)點(diǎn) 1)方便級(jí)聯(lián)調(diào)用:即調(diào)用依次發(fā)生的場(chǎng)景; 2)同步代碼編寫(xiě)方式: Promise...
    puxiaotaoc閱讀 105,895評(píng)論 7 62
  • 相對(duì)于回調(diào)函數(shù)來(lái)說(shuō),Promise是一種相對(duì)優(yōu)雅的選擇。那么有沒(méi)有更好的方案呢?答案就是async/await。優(yōu)...
    饑人谷_阿銀閱讀 899評(píng)論 0 0
  • 相對(duì)于回調(diào)函數(shù)來(lái)說(shuō),Promise是一種相對(duì)優(yōu)雅的選擇。那么有沒(méi)有更好的方案呢?答案就是async/await。優(yōu)...
    松哥888閱讀 47,839評(píng)論 8 36
  • async函數(shù)是使用async關(guān)鍵字聲明的函數(shù),async函數(shù)是AsyncFunction構(gòu)造函數(shù)的實(shí)例,返回值是...
    hunter97閱讀 310評(píng)論 0 0
  • 原文連接:https://blog.csdn.net/sinat_17775997/article/details...
    小豆soybean閱讀 4,360評(píng)論 0 7

友情鏈接更多精彩內(nèi)容