JS中のAsync/Awaitの使用を最適化します.

JSでasync関数を呼び出すとPromiseオブジェクトに戻ります.async関数が1つの値に戻ると、Promiseのresove方法はこの値を伝達します.async関数が異常を投げた時、Promiseのreject方法もこの異常値を伝えます.async関数でawait表式に会えば、async関数は実行を停止し、表式のPromise解析が完了したらasync関数を実行して結果を返します.
上の定義に基づいて、下記のコードを比較してみます.最適化点はどのように検査されているか分かります.

function resolveAfter2Seconds(x) {
  return new Promise(resolve =>setTimeout(() =>  resolve(x), 2000))
}

async function fn1(x) {
  var a = resolveAfter2Seconds(20)
  var b = resolveAfter2Seconds(30)
  return x + await a + await b
}

// prints 60 after 2 seconds
fn1(10).then(v => console.log(v))

async function fn2(x) {
  var a = await resolveAfter2Seconds(20)
  var b = await resolveAfter2Seconds(30)
  return x + a + b
}

// prints 60 after 4 seconds
fn2(10).then(v => console.log(v))

上のコードのデモコードでは,異なるawait位置宣言が,関数実行時間に直接影響を及ぼすことが分かった.同時に、私たちはasync関数の返却時に、そのrejectのシーンに対してtry-catchモジュールを捕獲しましたが、try-catchは独立した作用領域を創建します.(これは古い点です.新版のV 8は最適化されていますか?)ので、性能に多少の損失がありますが、コードの可読性に対しては、これぐらいの損は平気ですよ.

async function fn(url) {
  let v
  try {
    v = await doSomething(url)
  } catch (e) {
    v = await handlerError(url)
  }
  return success(v)
}

//        ,                   

async function fn(url) {
  let v
  v = await doSomething(url).catch(err => {
      v = await handlerError(url)
  })
  return success(v);
}