Date 객체와 날짜와 시간

Kiwisae 2022. 8. 12. 12:28

자바스크립트의 내장 객체 중 하나인 Date를 이용해 날짜와 시간을 구할 수 있다.

운영체제의 정보를 가져올 수도 있고, 특정 날짜 정보를 저장할 수도 있다.

다음 메소드들을 함께 사용한다.

getFullYear()	getYear() 로 연도를 구하면 제대로 된 값이 나오지 않는다. (2022년 기준, getYear()=122, getFullYear()=2022)
getMonth()	구해지는 값의 범위가 0~11이기 때문에 사용할 때 getMonth()+1로 사용해야 한다.
getDate()
getHours()
getMinutes()
getSeconds()
getDay()	요일을 숫자로 반환한다. 일요일부터 0으로 시작.

<script>
	var t = new Date();
	var year = t.getYear();

	var y = t.getFullYear();
	var m = t.getMonth()+1;
	var d = t.getDate();

	var h = t.getHours();
	var mm = t.getMinutes();
	var s = t.getSeconds();
    
	var w = t.getDay();
	var week=['일', '월', '화', '수', '목', '금', '토'];

	document.write("getYear(): "+year+"<br>");
	document.write(y+"."+m+"."+d+" "+h+":"+mm+":"+s+" "+week[w]+"요일");
</script>

이 때, setTimeout() 함수를 사용한다면 사용자가 새로고침을 하지 않아도

시계처럼 1초에 한번씩 초가 자동으로 바뀌도록 할 수 있다.

setTimeout(명령, 시간(1/1000)) : 지정된 시간이 경과되면 명령을 실행한다.

1초에 한번씩 명령을 실행하고 싶다면 시간 자리에 1000을 넣는다.

이 setTimeout() 을 해제하려면 clearTimeout() 을 사용한다.

이 함수를 상태표시줄에서 1초에 한번씩 초가 바뀌도록 실행시켜보았다.

<head>
<script>
    function show(){
		var t = new Date();
		var y = t.getFullYear();
		var m = t.getMonth()+1;
		var d = t.getDate();
		var h = t.getHours();
		var mm = t.getMinutes();
		var s = t.getSeconds();
		
		window.status = y+"."+m+"."+d+" "+h+":"+mm+":"+s 
		w = setTimeout("show()", 1000);
	}
	
	function stop(){
		clearTimeout(w);
	}
</script>
</head>

start 버튼을 누르면 실행되고, stop 버튼을 누르면 멈춘다.

<body>
	<input type="button" value="start!" onClick="show()">
	<input type="button" value="stop.." onClick="stop()">
</body>