ブログ

javascriptで同期しながらsleepさせる方法

javascriptはsleep機能がないため、実装するためにはちょっとしたテクニックが必要です。たとえば、1秒後に処理を実行させたい場合は

setTimeout(() => {
   //ここに実行させたい処理を書く
  console.log(‘1秒後に実行されます。’);
}, 1000);

でも、これじゃ非同期なので都合が悪い時もあります。
仕方ないのでDate().getTime()で時間を取得して1秒経ったら処理を実行するようにループ処理を入れる。
でも、今度は同期にはなるが1秒間は画面操作が全くできない(1秒間ずっとループ処理が走るのでほかの処理を受け付けてくれない)
もしこれが5秒、10秒だったら? しかもフロント側のCPU消費が激しくなる。intervalとの組み合わせもありますが面倒です。
そこで簡単に同期を保ちながらsleep処理を行うにはPromiseを使います。

return new Promise((resolve) => {
  setTimeout(() => {
    console.log(‘sync1 awake in 1000ms sleep’);
    resolve(‘resolveに戻り値をセットしないと呼び出し元はずっと待機状態になるよ。’);
  }, 1000)
}).then(() => {
  console.log(‘sync2′);
});

こんな感じで実装できます。ほかにawaitを使う方法もあるので好きなほうで。ここはポイントだけ押さえているのでシンプルですが、初心者にはちょっと優しくないかもしれないですね。

関連記事

  1. 満員電車
  2. 燕温泉
  3. 再び三峯神社の地へ
  4. この頃ちょっと気になる
  5. 腰を痛めた!
  6. ハレルヤ
  7. 五月の「だったな」
  8. S.O.Sボタン

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

PAGE TOP