本文介紹的是關于es6中Async函數的相關內容，非常出來供大家參考學習，需要的朋友們下面來看看詳細的介紹：
async 函數
async 函數，使得異步操作變得更加方便。它是 Generator 函數的語法糖。
Generator 函數，依次讀取兩個文件:
var fs = require('fs');var readFile = function (fileName) { return new Promise(function (resolve, reject) { fs.readFile(fileName, function(error, data) { if (error) reject(error); resolve(data); }); });};var gen = function* () { var f1 = yield readFile('/etc/fstab'); var f2 = yield readFile('/etc/shells'); console.log(f1.toString()); console.log(f2.toString());};寫成async函數，就是下面這樣:
var asyncReadFile = async function () { var f1 = await readFile('/etc/fstab'); var f2 = await readFile('/etc/shells'); console.log(f1.toString()); console.log(f2.toString());};async函數對 Generator 函數的改進，體現在以下四點:
1）內置執行器
Generator 函數的執行必須靠執行器，所以才有了co模塊，而async函數自帶執行器。也就是說，async函數的執行，與普通函數一模一樣，只要一行。
var result = asyncReadFile();
上面的代碼調用了asyncReadFile函數，然后它就會自動執行，輸出最后結果。這完全不像 Generator 函數，需要調用next方法，或者用co模塊，才能真正執行，得到最后結果。
2）更好的語義
async和await，比起星號和yield，語義更清楚了。async表示函數里有異步操作，await表示緊跟在后面的表達式需要等待結果。
3）更廣的適用性
co模塊約定，yield命令后面只能是 Thunk 函數或 Promise 對象，而async函數的await命令后面，可以是Promise 對象和原始類型的值（數值、字符串和布爾值，但這時等同于同步操作）。
4）返回值是 Promise
async函數的返回值是 Promise 對象，這比 Generator 函數的返回值是 Iterator 對象方便多了。你可以用then方法指定下一步的操作。
進一步說，async函數完全可以看作多個異步操作，包裝成的一個 Promise 對象，而await命令就是內部then命令的語法糖。
一、基本用法
async函數返回一個 Promise 對象，可以使用then方法添加回調函數。當函數執行的時候，一旦遇到await就會先返回，等到異步操作完成，再接著執行函數體內后面的語句。
function timeout(ms) { return new Promise((resolve) => { setTimeout(resolve, ms); });}async function asyncPrint(value, ms) { await timeout(ms); console.log(value);}asyncPrint('hello world', 5000);上面代碼指定5000毫秒以后，輸出hello world。
由于async函數返回的是 Promise 對象，可以作為await命令的參數。所以，上面的例子也可以寫成下面的形式:
async function timeout(ms) { await new Promise((resolve) => { setTimeout(resolve, ms); });}async function asyncPrint(value, ms) { await timeout(ms); console.log(value);}asyncPrint('hello world', 5000);async 函數多種使用形式
// 函數聲明async function foo() {}// 函數表達式const foo = async function () {};// 對象的方法let obj = { async foo() {} };obj.foo().then(...)// Class 的方法class Storage { constructor() { this.cachePromise = caches.open('avatars'); } async getAvatar(name) { const cache = await this.cachePromise; return cache.match(`/avatars/${name}.jpg`); }}const storage = new Storage();storage.getAvatar('hzzly').then(…);// 箭頭函數const foo = async () => {};二、語法
async函數的語法規則總體上比較簡單，難點是錯誤處理機制。
返回 Promise 對象
async函數返回一個 Promise 對象。async函數內部return語句返回的值，會成為then方法回調函數的參數。
async function f() { return 'hello world';}f().then(v => console.log(v))// "hello world"Promise 對象的狀態變化
async函數返回的 Promise 對象，必須等到內部所有await命令后面的 Promise 對象執行完，才會發生狀態改變，除非遇到return語句或者拋出錯誤。也就是說，只有async函數內部的異步操作執行完，才會執行then方法指定的回調函數。
async function getTitle(url) { let response = await fetch(url); let html = await response.text(); return html.match(/<title>([/s/S]+)<//title>/i)[1];}getTitle('https://tc39.github.io/ecma262/').then(console.log)// "ECMAScript 2017 Language Specification"上面代碼中，函數getTitle內部有三個操作：抓取網頁、取出文本、匹配頁面標題。只有這三個操作全部完成，才會執行then方法里面的console.log。
三、使用注意點
await命令后面的Promise對象，運行結果可能是rejected，所以最好把await命令放在try…catch代碼塊中。
async function myFunction() { try { await somethingThatReturnsAPromise(); } catch (err) { console.log(err); }}// 另一種寫法async function myFunction() { await somethingThatReturnsAPromise() .catch(function (err) { console.log(err); };}多個await命令后面的異步操作，如果不存在繼發關系，最好讓它們同時觸發。
//異步操作（即互不依賴），被寫成繼發關系。這樣比較耗時，因為只有getFoo完成以后，才會執行getBar，完全可以讓它們同時觸發。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;
await命令只能用在async函數之中，如果用在普通函數，就會報錯。
更多關于async函數的使用例子可以點擊查看這篇文章：//www.survivalescaperooms.com/article/113475.htm
總結
以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對武林網的支持。
新聞熱點
疑難解答
