🍇

async/await の書き方

に公開
  • async と await はペアで使う必要がある。await 後の行はリターン値が得られるまで待機する。
  • async/await を使用することで、コールバック関数や then メソッドのチェインを使わずに、非同期な処理をシンプルに記述することができる。

アロー関数

const myFunction = async () => {
  try {
    const result = await ccc();  // cccの処理が完了するまで次の行には行かない
    console.log(result); // 結果を表示
  } catch (error) {
    console.error(error); // エラー処理
  }
};

関数

async function myFunction() {
  try {
    const result = await ccc();  // cccの処理が完了するまで次の行には行かない
    console.log(result); // 結果を表示
  } catch (error) {
    console.error(error); // エラー処理
  }
}

useEffect()を使用する場合

useEffect(() => {
    const aaa = async () => {
      try {
        const bbb = await ccc();  // cccの処理が完了するまで次の行には行かない
          eee();
      } catch (error) {
        error(true);
      } 
    };
    aaa(); // useEffect()で処理を実行するためには明示的に関数を呼び出す必要がある
  }, [fff]);

Discussion