さまざまな理由から、一瞬処理を止めたい時があると思います。その際、よく使われるのが”sleep”関数です。しかし、実は、JavaScriptにはsleep関数が無いので、自分で同じような機能を実装する必要があります。
sleep関数に似た機能を実装するためには、いくつもの実装方法があり、自分が使いやすい実装を見つける必要があります。その中でも本ブログでは私が思う、JavaScriptを使って最も簡単にsleep機能を実装する方法をご紹介いたします。
sleep機能の実装方法
sleep機能を実装する最も簡単な方法は、”setTimeout”関数を使って実装する方法です。
”setTimeout”関数は指定した時間の後に、引数で指定した、Callback関数を呼び出す関数です。
この関数を利用することで、簡単にsleep機能を実装することができます。
Promise(await)を利用する方法
// sleep関数
function sleep(time) {
return new Promise(resolve => setTimeout(resolve,time));
}
// 使い方
async function printlog() {
await sleep(5000); // msで指定
console.log("test");
}
printlog();
本実装では、Promiseを利用しています。awaitを利用することにより、非同期関数を同期的に利用することが可能です。この機能を利用して、sleepと似たような機能を実装しています。
また、awaitを使う際には、awaitを利用している関数に非同期関数であることを示す”async”を宣言してあげる必要があります。
まとめ
JavaScriptで、処理を一時的に止めるsleep機能を実装する方法は、実装者によりいくつも実装方法があります。その中でも今回ご紹介させていただいた、実装方法は多くの方が紹介されており、最もスッキリした書き方だと思います。
一点難点としては、async/awaitが初心者の方には少し難しい場合があります。その場合は”setInterval”関数などを利用した、sleepの実装方法をご検討いただければと思います。
コメント