Javascript

setInterval()を使ってみよう

setInterval()を使って、指定した時間ごとに処理を実行する方法について見ていきます。

  • setInterval()
  • clearInterval()

setInterval()

・セットインターバルを使うとタイマー機能を作ることが出来ます。関数とミリ秒単位の数値を渡すと、この関数をミリ秒間隔でくり返し実行してくれます。

・注意点としてshowTime,の後ろに()をつけないことが大切でもし()をつけた場合,この関数を実行したときに返ってくる値を setInterval() に渡すことになるので、今回だと関数には返り値がないので、その場合 undefined を渡すことになってしまいます。

・そうすると、処理が 1000 ミリ秒、つまり 1 秒ごとにくり返されます。

clearInterval()

・次にタイマーを止める処理についてです。今回は3回処理したら止まるようにプログラムを書いていきます。

・そのためには setInterval() を実行したときに返ってくる値が必要になるので、それを intervalIdという定数に代入します。

・まずはカウンター用の変数を用意しておきます。let i = 0;として、カウンターを増やして i の値が 2 より大きくなったら処理が止まるように if 文を書いてあげましょう。

if文はi++; if(i > 2){clearInterval(intervalId);}としてあげるとokです。 clearInterval() という命令に先ほどの intervalId を渡してあげれば showTime()の処理は止まります。

-Javascript