자바스크립트 내장 함수

자바스크립트는 자체적으로 몇 가지 함수를 제공한다.

이렇게 기본적으로 내장된 함수를 내장 함수라고 부른다.

지금까지 사용해봤던 alert() 함수와 prompt() 함수가 내장함수다.

alert, prompt 이외의 다양한 내장 함수를 살펴보자.

1. 타이머 함수

타이머 함수는 특정한 시간에 특정한 함수를 실행할 수 있게 해주는 함수다.

4가지 종류가 있다.

setTimeout(function, millisecond)

setInterval(function, millisecond)

clearTimeout(id)

clearInterval(id)

setTimeout() 함수는 특정한 시간 후에 함수를 한 번 실행하고,

setInterval() 함수는 특정한 시간마다 함수를 실행한다.

먼저, setTimeout() 함수의 예제를 살펴보자.

<script>

//3초 후에 함수를 실행한다.

setTimeout(function() {

alert('3초가 지났습니다.');

}, 3000);

</script>

위에 코드를 실행하면,

3초 후에 경고창을 출력된다.

그 다음으로, setInterval() 함수를 살펴보자.

<script>

//3초마다 함수를 실행한다.

setInterval(function () {

alert('3초마다 출력합니다.');

}, 3000);

</script>

위에 코드를 실행하면,

3초마다 setInterval() 함수가 실행되면서, 경고창을 출력한다.

setInterval() 함수는 특정 시간마다 지속적으로 실행되기 때문에,

타이머를 멈출 필요가 있다.

타이머를 멈추려면, clearTimeout() 함수와 clearInterval() 함수를 사용한다.

setTimeout() 함수와 setInterval() 함수를 사용하면 타이머 아이디를 리턴하는데,

이 타이머 아이디를 clearTimeout() 함수와 clearInterval() 함수의 매개변수에 넣어주면

타이머를 정지할 수 있다.

clearInterval() 함수를 적용해봄으로써, 사용법을 공부해보자.

10초 동안 경고창을 계속 출력하도록 수정해보자.

<script>

//1초마다 함수를 실행한다.

var intervalID = setInterval(function () {

alert('1초마다 출력합니다.');

}, 1000);

//10초 후 함수를 실행한다.

setTimeout(function () {

//타이머를 종료한다.

clearInterval(intervalID);

}, 10000);

</script>

참고 서적 : 모던 웹을 위한 JavaScript + jQuery 입문(개정판)

윤인성 지음. 한빛미디어