淺談我對ES2017中異步函數的理解

作者：代培
地址：http://daipei.me/posts/understand_the_async_function_in_es2017/
轉載請註明出處
我的博客搬家了，新博客地址：daipei.me

ES2017標準中引入了異步函數的特性

異步函數內部有等待的操作，等待promise執行耗時操做後的結果，並根據結果執行一些邏輯。

異步函數有意思的地方在於雖然內部有耗時操作，但是被調用後卻能夠立即返回。

function resolveAfter2Seconds() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('resolved');
    }, 2000);
  });
}

async function asyncCall() {
  console.log('calling');
  var result = await resolveAfter2Seconds();
  console.log(result);
  // expected output: "resolved"
}

asyncCall();

此代碼引用自MDN

如果不使用這個特性，當我們調用一個異步接口的時候，我們需要傳入一個回調函數，由異步接口的實現來調用回調邏輯

function resolveAfter2Seconds(callback) {
    setTimeout(function() {
        callback('resolved')
    }, 2000);
}

function syncCall() {
    console.log('calling');
    resolveAfter2Seconds(function(result) {
        console.log(result);
    });
}

syncCall();

• 使用異步函數的特性後，從形態來看，異步的接口變成了同步的接口，不需要再傳入回調函數

• promise對象作爲其中的橋樑，執行耗時操作，並傳遞執行後的結果

• 耗時操作從以前提供異步接口的函數中轉移到了異步函數中，在異步函數中進行同步操做

• 回調函數中的邏輯移到了異步函數中，異步函數可以看成對之前異步接口調用的封裝

在我看來異步函數有以下優點和缺點：

優點：避免回調函數的層層嵌套，用同步的形式實現了異步的功能

缺點：
1. 屏蔽了實現細節，提高了理解成本
2. 相較之前多出了一個函數

爲什麼這樣說，如果不使用異步函數的特性，我們可以直接調用異步接口，並傳入回調函數，那麼只存在異步接口這一個函數，使用異步函數特性後，之前的異步接口變成同步接口，直接返回一個promise對象，這時候又需要一個額外的異步函數來調用這個同步接口同時包含回調函數中的邏輯

從某些角度來看，之前的回調函數變成了現在的異步函數，匿名函數變成了非匿名函數。

（PS：異步接口是指含有需要傳入回調函數作爲參數的接口）