Javascriptで n 秒ごとにイベントを発火したい
2020.04.02
みさなま、こんにちは。
今回はJavascriptを使用し、n 秒ごとにイベントを発火する方法をまとめましたので参考にしてください。
Javascriptで n 秒ごとにイベントを発火したい
試しにソースを確認することが１番なので、デベロッパーツールのコンソールを使用し、動作確認をしてみてください。
１秒ごとにイベントを発火したい
|
1 2 3 4 5 |
var count = 0; var countup = function () { console.log(count++); } setInterval(countup, 1000); |
まずはソースを記載したので、試してみてください。
コンソールで確認すると１秒ごとに＋１の処理が実行されていることを確認できましたでしょうか。
n 秒ごとの n を指定しているのは setInterval(countup, 1000);の1000という数字。
この数字は n ミリ秒となっていますので、1000ミリ秒 = １秒となります。
つまりこの数字を2000に変更すれば２秒ごとに数字がプラスしていきます。
Javascriptで n 秒後にイベントを発火したい
次に n 秒ごとではなく n 秒後にイベントを発火する方法を。
１秒後にイベントを発火したい
|
1 2 3 4 |
var countup = function () { alert('10秒経過しました'); } setTimeout(countup, 10000); |
例にもれずまずはソースを記載しました。
コンソールで確認してみてください。
10秒後にアラートが出ることが確認できましたでしょうか。
考え方は n 秒ごとと同じで、それぞれの違いは setInterval と setTimeout という関数の違い。
setInterval とsetTimeoutの違いは簡単
それぞれ何が違うかというと、
setInterval……一定時間ごとに特定の処理を繰り返す
setTimeout ……一定時間後に特定の処理をおこなう（繰り返さずに一度だけ）
たったこれだけで何ともシンプル。
ぜひこちらの関数を使いタイマーを操ってみてください。
