JavaScriptで定期的に関数を呼び出す方法はありますか?


回答:


214

あなたが欲しいsetInterval()

var intervalID = setInterval(function(){alert("Interval reached");}, 5000);

setInterval()の最初のパラメータは、評価されるコードの文字列にすることもできます

周期関数は次の方法でクリアできます。

clearInterval(intervalID);

15
setIntervalに文字列引数を使用しているため、私は賛成票を投じた後、賛成票を取り消すことにしました(ただし、反対票は取り消さない)。関数はほとんどの場合、効率、セキュリティ、およびクロージャ機能のために、文字列引数を優先して使用する必要があります。
Jason S、

5
大丈夫ですよ。 setInterval()パラメータに関係なく、質問に対する正しい答えです。これは単なる例であり、どちらの方法も当然のことながら正しいものです。
zombat 2009

2
Jason Sに同意します。それは本当に関数であるべきです。あなたの例では、唯一の問題は無視できるほどのパフォーマンスの損失ですが、それは入り込むのが悪い習慣です。
Matthew Crumley、

4
私はあなたの両方に同意します、関数を使うほうが良いです。そうではないと私は言ったことがありません。それはどちらの方法でも正しいですが、コメントのために、代わりに関数を含むように回答を編集します。
zombat 2009

37

setInterval()は、多くの場合、定期的な実行のための最善の解決策ではないことに注意してください-それは本当にあなたが実際に定期的に呼び出しているJavaScriptのかに依存します。

例えば。1000ミリ秒の周期でsetInterval()を使用し、定期的な関数でajax呼び出しを行うと、ときどき2秒かかるため、最初の応答が返される前に別のajax呼び出しを行います。これは通常望ましくありません。

多くのライブラリには、Nelsonによって提供されたPrototypeの例のように、単純にsetIntervalを使用することの落とし穴から保護する定期的なメソッドがあります。

jQuery ajax呼び出しを含む関数でより堅牢な定期実行を実現するには、次のようなことを検討してください。

function myPeriodicMethod() {
  $.ajax({
    url: ..., 
    success: function(data) {
      ...
    },
    complete: function() {
      // schedule the next request *only* when the current one is complete:
      setTimeout(myPeriodicMethod, 1000);
    }
  });
}

// schedule the first invocation:
setTimeout(myPeriodicMethod, 1000);

別のアプローチは、setTimeoutを使用しますが、変数で経過時間を追跡し、各呼び出しのタイムアウト遅延を動的に設定して、可能な限り望ましい間隔に関数を実行しますが、応答が返されるより速くなることはありません。


setTimeout(myPeriodicMethod、1000); 2回呼ばれます。必要ですか?set time outは完全な関数でのみ呼び出す必要があると思います
Vishnudev K '

1
はい、2番目のsetTimeout()は必須ではありません。最初のajax呼び出しをすぐに実行するmyPeriodicMethod()を呼び出すだけで済みますが、最初の呼び出しから遅延してスケジュールする場合は、次のように記述できます。私は書いた。
Matt Coubrough、2014

16

誰もがすでにsetTimeout / setIntervalソリューションを持っています。文字列だけでなく、関数をsetIntervalに渡すことができることに注意することが重要だと思います。それらの関数に「評価」される文字列ではなく、実際の関数を渡す方が実際には少し「安全」です。

// example 1
function test() {
  alert('called');
}
var interval = setInterval(test, 10000);

または:

// example 2
var counter = 0;
var interval = setInterval(function() { alert("#"+counter++); }, 5000);

3
+1 JavaScriptクロックフォードスクールの生徒であれば、悪の形式すべてでevalを回避できます。
Patrick McElhaney、2009

@Patrick-「$(ドル記号)や\(バックスラッシュ)を名前に使用しない」という提案はjQueryのロットではうまくいかないと思います:)
Russ Cam

6

古い質問ですが、定期的なタスクランナーも必要で、TaskTimerを作成しました。これは、異なる間隔で複数のタスクを実行する必要がある場合にも役立ちます。

// Timer with 1000ms (1 second) base interval resolution.
var timer = new TaskTimer(1000)

// Add task(s) based on tick intervals.
timer.addTask({
    name: 'job1',       // unique name of the task
    tickInterval: 5,    // run every 5 ticks (5 x interval = 5000 ms)
    totalRuns: 10,      // run 10 times only. (set to 0 for unlimited times)
    callback: function (task) {
        // code to be executed on each run
        console.log(task.name + ' task has run ' + task.currentRuns + ' times.');
    }
});

// Start the timer
timer.start();

TaskTimerブラウザとノードの両方で機能します。すべての機能のドキュメントを参照してください。




2
function test() {
 alert('called!');
}
var id = setInterval('test();', 10000); //call test every 10 seconds.
function stop() { // call this to stop your interval.
   clearInterval(id);
}


1

本来の方法は確かにsetInterval()/ clearInterval()ですが、Prototypeライブラリをすでに使用している場合は、PeriotionalExecutorを利用できます。

new PeriodicalUpdator(myEvent, seconds);

これにより、呼び出しの重複を防ぎます。http://www.prototypejs.org/api/periodicalExecuterから:

「指定した間隔よりも実行に時間がかかる場合は、コールバック関数の複数の並列実行から保護されます(コールバック関数の例外から保護されている内部の「実行中」フラグを維持します)。これは、 1つを使用して、一定の間隔でユーザーとやり取りします(たとえば、プロンプトを使用するか、通話を確認します)。これにより、複数のメッセージボックスがすべて操作されるのを待機しなくなります。」

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.