JavaScript版のsleep（）とは？自作sleep関数の実装方法を解説

JavaScriptには、他の多くのプログラミング言語に存在するようなネイティブのsleep（スリープ）関数が用意されていません。しかし、いくつかのテクニックを使えば、この制限を簡単に回避することが可能です。

最も手軽な方法のひとつが、setTimeoutとasync/awaitを組み合わせて、独自のsleep関数を作成することです。

実装例

const sleep = milliseconds => new Promise(resolve => setTimeout(resolve, milliseconds))

// コールバックを使う場合
sleep(1000).then(() => console.log("waited 1 second!"))

// async / await を使う場合
const waitASec = async () => {
    await sleep(1000)
    console.log("waited 1 second!")
}
waitASec()

実行結果

waited 1 second!
waited 1 second!

コードの仕組み

このsleep関数は、引数として受け取ったミリ秒数をもとに新しいPromiseを返します。Promiseの内部ではsetTimeoutが呼び出され、指定した時間が経過したタイミングでresolveが実行されます。そのため、awaitキーワードと組み合わせることで、指定時間だけ処理を一時停止させることができるのです。

利用時の注意点

awaitを使用してsleep関数を待機させる場合は、必ずasync関数の中で呼び出す必要があります。一方、コールバック形式（then）であれば通常の関数内でも利用可能です。用途に応じて使い分けるとよいでしょう。