[Javascript] 타이머 함수

타이머 함수를 일정한 시간마다 특정 구문을 실행하고자 할 때 사용하는 기능으로 전역 객체인 window에 있다.

이름	설명
setInterval()	일정 시간마다 주기적으로 특정 구문을 실행하는 기능
setTimeOut()	일정 시간이 지난 후 특정 구문을 딱 한번 실행하는 기능
clearInterval()	실행 중인 타이머 함수를 멈추는 기능

 

1. setInterval() :  일정 시간마다 주기적으로 특정 구문 실행

//익명함수로 실행
var count = 0;
setInterval(function() {
    count++;
    console.log(count);
}, 1000);

//익명함수 대신 add함수를 만들어 파라미터로 추가
var count1 = 0;
function add() {
    count1++;
    console.log(count);
}

setInterval(add, 1000);

//add함수에 파라미터 전달
var count2 = 0;
function add(name) {
    count2++;
    console.log(name + " : " + count2);
}

setInterval(add, 1000, 'yujin');

 

2.setTimeOut() : 일정 시간이 지난 후 특정 구문을 딱 한번 실행

setTimeout(function() {
    console.log("test1");
}, 1000);

function hello() {
    console.log('Function hello');
}

setTimeout(hello, 2000);

function name(greet, name) {
    console.log(greet + " " + name);
}

setTimeout(name, 3000, 'hello', 'yujin');

 

3.clearInterval() : 실행 중인 타이머 함수를 종료

var count = 0;
var test = setInterval(function() {
    console.log(++count);
}, 1000);

setTimeout(function() {
    clearInterval(test);
}, 4000)

setInterval() 함수와 setTimeout()함수를 이용해 생성한 타이머는 clearInterval()함수를 이용해 멈출 수가 있다.

setInterval()과 setTimeout함수의 반환 값을 clearInterval() 함수의 인자로 실행하면 타이머 함수 종료