async/awaitを使用してsetTimeoutで３秒待機してから次の処理をする。

非同期処理を学んでいる途中にsetTimeoutを非同期にするためにはどうしたらいいだろうということで覚えた書き方をアウトプットします。

console.log('hi Mark'); // すぐに 'hi Mark' を出力

// delay関数を定義。msミリ秒だけ待機し、Promiseを返す
const delay = (ms) => {
    return new Promise((resolve) => { // Promiseを作成
        setTimeout(() => { // msミリ秒後にコールバック関数を実行
            console.log('hi Juno'); // 'hi Juno' を出力
            resolve(); // Promiseを解決し、awaitの待機を終了
        }, ms); // 指定した待機時間
    });
};

// start関数を非同期関数として定義
const start = async () => {
    await delay(3000); // delay関数を呼び出し、3秒待機
    console.log('See you later'); // 待機終了後に 'See you later' を出力
};

// start関数を実行
start();

実行結果

//hi Mark
//(三秒待機)
//hi Juno
//see you later

まとめ

1. setTimeoutをPromiseでラップする関数を作成
2. start関数でまとめて処理