setInterval 타이머의 사용 자바스크립트

자바스트립트에서 setInterval 함수를 이용한 타이머의 활용

프로그램을 작성할 경우 타이머가 사용되어지는 빈도는 매우 높습니다.

setInterval과 유사한 setTimeout 를 이용하여 타이머를 사용하는 내용에 대해 지난번에 포스팅했습니다.

(setTimeout 보러가기)

이번 포스팅은 setInterval에 대한 내용입니다.

 

setInterval 함수 사용형식

t = setInterval(mmm, 1000); // 1000 = 1초입니다.

function mmm()
{
      실행할 명령들 ~;
}

위 형식으로 사용하면 1초마다 mmm 함수가 호출되어 실행되어집니다.

 

setInterval 함수의 사용예제

<input type=text id=txt_temp value=1>

<script>
var t = setInterval(mmm, 1000);

function mmm()
{
       txt_temp.value = txt_temp.value*1 + 1;
}
</script>

 위 예제는 아래와 같은 화면이 나타나며, 숫자가 1에서 시작하여 1초에 1씩 계속 증가합니다.

setInterval 예제

 

 

setInterval 타이머의 중지

위에서 setInterval을 통해서 1초마다 mmm 함수를 호출하였는데, 특정 조건에서 타이머를 중지할 필요가 있습니다.

예를 들면, 10번만 mmm 함수를 호출하고 싶은 경우이지요.

이럴 경우에는 clearInterval 을 사용하시면 됩니다.

이 함수는 clearTimeout 함수와 함께 다음 포스팅에서 설명하겠습니다.