[2021年]Promoiseでwait風メソッド

前置き

以前こんな記事を書いてLGTMをたくさんもらいましたが今回はその別解でよりモダンな方法を紹介します。

async, await, Promiseメソッドが実装されたことにより、より簡単に、しかも非jQueryでwaitを実現できるようになりました。

実装

  function wait(msec) {
    return new Promise((resolve) => setTimeout(resolve, msec));
  }

これだけです。え？これどう動かすの、と言われたら使い方は二種類あります。

パターン１

console.log(new Date);

wait(5000).then(() => {
  console.log(new Date);
});

このタイプは単純にPromiseのメソッドチェーンを使っているのでどこでも使えます。ただしメソッド自体は非同期で走るのでwaitは素通りされてします。

パターン2

async function test() {
  console.log(new Date);
  await wait(5000);
  console.log(new Date);
}

今度のタイプはasyncメソッドの中であればawaitでpromiseを待つことができることを利用しているのでsleep関数みたいな使い方ができます。

javascriptは日々進化していて便利になっていってますのでついていくのが大変な反面面白い言語です。