async 函數

1.ES2017 標準引入了 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) return 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 函數的星號（*）替換成 async，將 yield 替換成 await，同時不需要co模塊，更加語義化；

2.async 函數返回一個 Promise 對象，內部return語句返回的值，會成為then方法回調函數的參數；

async function f() {
  return ‘hello world‘;
}

f().then(res => console.log(res))
// "hello world"

3.async 函數返回的 Promise 對象，必須等到內部所有 await 命令後面的 Promise 對象執行完，才會發生狀態改變，除非遇到 return 語句或者拋出錯誤。也就是說，只有 async 函數內部的異步操作執行完，才會執行 then 方法指定的回調函數；

4.如果 async 函數內部拋出錯誤，會導致返回的 Promise 對象變為 reject 狀態，拋出的錯誤對象會被catch方法回調函數接收到；

async function f() {
  throw new Error(‘出錯了‘);
}

f().then(
  res => console.log(res),
  err => console.log(err)
)
// Error: 出錯了

5.await 命令後面是一個 Promise 對象。如果不是，會被轉成一個立即 resolve 的 Promise 對象

async function f() {
  return await ‘Hello World‘;
}

f().then(res => console.log(res))
// ‘Hello World‘

上述代碼中，await命令的參數是 ‘Hello World‘，它被轉成 Promise 對象，並立即 resolved

6.await 命令後面的 Promise 對象如果變為reject狀態，則 reject 的參數會被 catch 方法的回調函數接收到

async function f() {
  await Promise.reject(‘出錯了‘);
}

f().then(res => console.log(res))
   .catch(err => console.log(err))

// 出錯了

7.async 函數中 ， 只要一個await語句後面的 Promise 變為reject，那麽整個 async 函數都會中斷執行；

async function f() {
  await Promise.reject(‘出錯了‘);
  await Promise.resolve(‘hello world‘); // 不會執行
}

f();  // 出錯了

8.如果我們希望即使前一個異步操作失敗，也不要中斷後面的異步操作。那我們可以將第一個 await 放在 try...catch 結構裏面，這樣不管這個異步操作是否成功，第二個 await 都會執行；

async function f() {
  try {
    await Promise.reject(‘出錯了‘);
  } catch(e) {
    
  }
  return await Promise.resolve(‘hello world‘);
}

f().then(res => console.log(res))

// hello world

或者是 await 後面的 Promise 對象再跟一個 catch 方法，處理前面可能出現的錯誤：

async function f() {
  await Promise.reject(‘出錯了‘)
    .catch(err => console.log(err));
  return await Promise.resolve(‘hello world‘);
}

f()
.then(res => console.log(res))
// 出錯了
// hello world

9.如果 await 後面的異步操作出錯，那麽等同於 asyn c函數返回的 Promise 對象被 rejected：

async function f() {
  await new Promise(function (resolve, reject) {
    throw new Error(‘出錯了‘);
  });
}

f().then(res => console.log(res))
   .catch(err => console.log(err))
// Error：出錯了

10.為了防止出錯，做法也是將其放在try...catch代碼塊之中，並且如果有多個await命令，可以統一放在try...catch結構中。

async function f() {
  try {
    await new Promise(function (resolve, reject) {
      throw new Error(‘出錯了‘);
    });
  } catch(e) {
  }
  return await(‘hello world‘);
}

f().then( res => console.log(res) )
// ‘hello world‘

11.使用 await 要註意以下幾點 ：

• await 命令後面的 Promise 對象，運行結果可能是 rejected，所以最好把 await 命令放在 try...catch 代碼塊中

   async function myFunction() {
     try {
       await operations();
     } catch (err) {
       console.log(err);
     }
   }
  
   // 另一種寫法
  
   async function myFunction() {
     await operations()
     .catch(function (err) {
       console.log(err);
     });
   }   
  

• 多個 await 命令後面的異步操作，如果不存在繼發關系（即互不依賴），最好讓它們同時觸發，縮短程序的執行時間

   // 寫法一
   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 function func(db) {
     let docs = [{}, {}, {}];
  
     // 報錯
     docs.forEach(function (doc) {
       await db.post(doc);
     });
   }

ES6必知必會 （八）—— async 函數