ES6學(xué)習(xí)筆記(20)之 async 函數(shù)

參考:ECMAScript 6 入門

使用場景:可以將異步方法以同步的方式執(zhí)行

  • async 函數(shù)是什么?一句話,它就是 Generator 函數(shù)的語法糖。async函數(shù)就是將 Generator 函數(shù)的星號(*)替換成async,將yield替換成await,并在調(diào)用 async 函數(shù)時按順序執(zhí)行異步方法??梢哉f async 函數(shù)就是 Generator 函數(shù)和自動執(zhí)行器(概念請參照上一篇)的結(jié)合。

  • async函數(shù)的返回值是 Promise 對象,這比 Generator 函數(shù)的返回值是 Iterator 對象方便多了。你可以用then方法指定下一步的操作。

  • 多個await命令后面的異步操作,如果不存在繼發(fā)關(guān)系,最好讓它們同時觸發(fā)。
    錯誤的寫法:

let foo = await getFoo();
let bar = await getBar();

正確的寫法:

// 寫法一
let [foo, bar] = await Promise.all([getFoo(), getBar()]);

// 寫法二
let fooPromise = getFoo();
let barPromise = getBar();
let foo = await fooPromise;
let bar = await barPromise;
  • 如何正確的使用 async 和 await?
    分析以下代碼,看能否按順序執(zhí)行,為什么?
function dbFuc(db) { 
  let docs = [{}, {}, {}];

  docs.forEach(async function (doc) {
    await db.post(doc);
  });
}

正確的寫法應(yīng)該是什么?請見文章最后。

  • 新的提案:(了解就行)
    根據(jù)語法規(guī)格,目前await命令只能出現(xiàn)在 async 函數(shù)內(nèi)部,否則都會報錯。
    目前,有一個語法提案,允許在模塊的頂層獨立使用await命令。這個提案的目的,是借用await解決模塊異步加載的問題(模塊間按順序互相依賴)。
// x.js
console.log("X1");
await new Promise(r => setTimeout(r, 1000));
console.log("X2");

// y.js
console.log("Y");

// z.js
import "./x.js";
import "./y.js";
console.log("Z");

打印結(jié)果是X1、Y、X2、Z
頂層的await命令有點像,交出代碼的執(zhí)行權(quán)給其他的模塊加載,等異步操作完成后,再拿回執(zhí)行權(quán),繼續(xù)向下執(zhí)行。


思考題答案:

async function dbFuc(db) {
  let docs = [{}, {}, {}];

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

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

  • 含義 async函數(shù)是Generator函數(shù)的語法糖,它使得異步操作變得更加方便。 寫成async函數(shù),就是下面這...
    oWSQo閱讀 2,046評論 0 2
  • async 函數(shù) 含義 ES2017 標準引入了 async 函數(shù),使得異步操作變得更加方便。 async 函數(shù)是...
    huilegezai閱讀 1,323評論 0 6
  • async 函數(shù) ES2017 標準引入了 async 函數(shù),使得異步操作變得更加方便。async 函數(shù)是什么?一...
    _羊羽_閱讀 2,227評論 0 1
  • 前面的話 ES2017標準引入了async 函數(shù),使得異步操作變得更加方便。本文將詳細介紹async函數(shù) 概述 a...
    CodeMT閱讀 1,393評論 0 3
  • 含義 ES2017標準引入了async函數(shù),使得異步操作變得更加方便.async函數(shù)其實就是Generator函數(shù)...
    JarvanZ閱讀 616評論 0 0

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