ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript で「setInterval」の間隔を動的に変更するにはどうすればよいですか?
実行中の setInterval の間隔の変更
setInterval メソッドを使用すると、指定した間隔で関数を繰り返し実行できます。ただし、関数の実行中にこの間隔を動的に調整する必要がある場合は、特定の課題が発生します。
この例では、次の行を使用して間隔を変更しようとしました:
var interval = setInterval(function() { ... }, 10*counter);
ただし、10*counter の値が 0 と評価されたため、このアプローチは失敗しました。この問題に対処するには、図に示すように匿名関数を使用できます。以下:
var counter = 10; var myFunction = function() { clearInterval(interval); // Stop the current interval counter *= 10; // Increment the counter interval = setInterval(myFunction, counter); // Set a new interval with the updated counter } var interval = setInterval(myFunction, counter); // Start the initial interval
この匿名関数は、現在の間隔をクリアし、カウンター値を調整し、更新されたカウンターで新しい間隔を設定します。
代替解決策: setTimeout を使用する
clearInterval と setInterval を使用する代わりに、setTimeout を利用して間隔調整を実装することもできます。このアプローチにより、以前の間隔をクリアする必要がなくなります:
var counter = 10; var myFunction = function() { counter *= 10; // Increment the counter setTimeout(myFunction, counter); // Set a new timeout with the updated counter } setTimeout(myFunction, counter); // Start the initial timeout
以上がJavaScript で「setInterval」の間隔を動的に変更するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。