Notice
Recent Posts
Recent Comments
Link
«   2024/10   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

WON.dev

chapter10 : 타이머_내장함수 본문

WEB.JS/04.함수_JS

chapter10 : 타이머_내장함수

GAWON 2023. 5. 19. 09:37
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<script type="text/javascript">
/*
타이머 함수

```
	1.특정한 시간에 특정한 함수를 실행시키는 함수
	2.전달 인자 : 함수, 시간(밀리초)
	3.종류
	    1) id = setTimeout(함수 , 시간)    :지정된 시간 후 함수를 한 번 실행
	    2) clearTimeout(id)             :해당 id setTimeout 중지 (1&2 세트로 사용)
	    3) id2 = setInterval(함수 , 시간)  :지정된 시간 후 함수를 반복하여 실행
	    4) clearInterval(id2)           :해당 id setInterval 중지 (3&4 세트로 사용)
	4.setInterval 함수의 경우는 지정된 시간마다 함수를 스택에 쌓아두는 방식을 사용
	  스택에 많이 쌓이면 원래 실행하기로 한 만큼 실행되지 않을 수 있다.

*/

//1. setTimeout 함수 이용 : 5초 후에 "안녕하세요" 경고창 출력하기
var hello = setTimeout(function(){
	alert("안녕하세요");
},5000);
clearTimeout(hello);

//2. setInterval 함수 이용 : 1초마다 숫자를 1씩 증가시켜서 출력하기

/*
var n = 0;
var id = setInterval(function(){
	document.write(++n);
}, 1000);
*/
//10초만 진행하고 종료
var n = 0;
var id = setInterval(function(){
	document.write(++n);
	if(n > 10)
		clearInterval(id);
}, 1000);

//3. setTimeout 함수 이용 : 1초마다 숫자를 1씩 증가시켜서 출력하기

n = 0;
function myTimer(){
	setTimeout(function(){
		document.write(++n);
		myTimer();
	},1000);
}
myTimer();

```

</script>
</head>
<body>

</body>
</html>

'WEB.JS > 04.함수_JS' 카테고리의 다른 글

chapter12 : 함수문제  (0) 2023.05.19
chapter11 : 함수문제  (0) 2023.05.19
chapter09 : 재귀함수  (0) 2023.05.19
chapter08 : 콜백함수  (0) 2023.05.19
chapter07 : 스코프  (0) 2023.05.19