ホームページ >ウェブフロントエンド >jsチュートリアル >反復の重複を防ぐために JavaScript ループに遅延を実装するにはどうすればよいですか?

反復の重複を防ぐために JavaScript ループに遅延を実装するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-22 22:57:14638ブラウズ

How Can I Implement Delays in JavaScript Loops to Prevent Overlapping Iterations?

JavaScript ループでの遅延の実装

問題:

JavaScript の while ループ内に遅延を導入すると、ループが実行されることがよくあります速すぎると、望ましくない結果につながります。反復間の遅延を含むループを作成するにはどうすればよいですか?

解決策:

setTimeout() 関数は、遅延を導入するのに便利ですが、ノンブロッキングで実行されます。すぐに。その結果、ループ内の複数の setTimeout() 呼び出しが重複します。

代わりに、再帰ループ パターンを利用して、目的の効果を達成できます。以下に例を示します。

var i = 1;                    // Set counter to 1

function myLoop() {         // Create loop function
  setTimeout(function() {   // Call 3s setTimeout when loop is called
    console.log('hello');   // Your code here
    i++;                    // Increment counter
    if (i < 10) {           // If counter < 10, call loop function again
      myLoop();             // Trigger another setTimeout()
    }                       
  }, 3000)
}

myLoop();                   // Start the loop

このアプローチでは、myLoop() 関数が setTimeout() コールバック内でそれ自体を再帰的に呼び出します。各反復は 3 秒遅れて、ループの順次実行を保証します。

以上が反復の重複を防ぐために JavaScript ループに遅延を実装するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。