3 분 소요

2022. 06. 02. 수업내용 정리

Date 객체.. 메소드..


  • 자바스크립트에서의 날짜 표현

    자바스크립트에서는 Date 객체를 사용하여 매 순간 변화하는 시간과 날짜에 관한 정보를 손쉽게 얻을 수 있습니다.

    Date 객체는 연월일, 시분초의 정보와 함께 밀리초(millisecond)의 정보도 함께 제공합니다.


    자바스크립트에서 날짜와 시간을 나타내기 위한 값의 범위는 다음과 같습니다.

    1. 연도(year) : 1900년(00) ~ 1999년(99)

    2. 월(month) : 1월(0) ~ 12월(11)

    3. 일(day) : 1일(1) ~ 31일(31)

    4. 시(hours) : 0시(0) ~ 23시(23)

    5. 분(minutes) : 0분(0) ~ 59분(59)

    6. 초(seconds) : 0초(0) ~ 59초(59)

    ★ 자바스크립트에서 월(month)을 나타낼 때 1월이 0으로 표현되고, 12월이 11로 표현됩니다.



  • Date 객체

    자바스크립트에서 Date 객체를 초기화하는 방법은 다음과 같습니다.

    1. new Date()

    2. new Date(“날짜를 나타내는 문자열”)

    3. new Date(밀리초)

    4. new Date(년, 월, 일, 시, 분, 초, 밀리초)

    Date 객체를 생성할 때 어떠한 인수도 전달하지 않으면, 현재 날짜와 시간을 가지고 Date 객체를 생성합니다.

    <!DOCTYPE html>
<html lang="ko">
  
<head>
	<meta charset="UTF-8">
	<title>JavaScript Date Object</title>
</head>
  
<body>
  
	<h1>현재 날짜와 시간으로 Date 객체 생성</h1>
  
	<p>결과보기를 다시 누를 때마다 현재 시간이 갱신됩니다.</p>
	<script>
		var date = new Date();	// Date 객체 생성
		document.write(date);
	</script>
  	
</body>
  
</html>

    웹페이지 화면 ▼

    image-20220608160701347


    Date 객체를 생성할 떄 인수가 전달되면, 그 형태에 따라 특정 날짜와 시간을 가리키는 Date 객체를 생성합니다.

    <!DOCTYPE html>
<html lang="ko">
  
<head>
	<meta charset="UTF-8">
	<title>JavaScript Date Object</title>
</head>
  
<body>
  
	<h1>특정 날짜와 시간으로 Date 객체 생성</h1>
  
	<script>
		document.write(new Date("December 14, 1977 13:30:00") + "<br>");	// 날짜를 나타내는 문자열
		document.write(new Date(80000000) + "<br>");						// 1970년 1월 1일 0시부터 해당 밀리초만큼 지난 날짜
		document.write(new Date(16, 5, 25) + "<br>");						// 3개의 숫자로 나타내는 날짜이며, 시간은 자동으로 00:00:00으로 설정됨.
		document.write(new Date(16, 5, 25, 15, 40, 0) + "<br>");			// 7개의 숫자로 나타내는 시간과 날짜
		document.write(new Date(2016, 5, 25, 15, 40, 0));					// 2000년대를 표기하고자 할 때에는 연도 4자리를 전부 표기해야 함.
	</script>
  	
</body>
  
</html>

    웹페이지 화면 ▼

    image-20220608160927000

    ★ 자바스크립트에서 날짜 계산의 모든 기준은 1970년 1월 1일 00:00:00(UTC, 협정세계시)부터입니다.
    또한, 하루는 86,400,000 밀리초(millisecond)로 계산됩니다.



  • 자바스크립트 날짜 양식(date format)

    자바스크립트에서 날짜를 표현할 수 있는 양식은 다음과 같습니다.


    1. ISO 날짜 양식
    2. Long 날짜 양식
    3. Short 날짜 양식
    4. Full 날짜 양식



    • ISO 날짜 양식

      ISO 8601은 날짜와 시간을 나타내는 국제 표준 양식입니다.

      문법
YYYY-MM-DDTHH:MM:SS // T는 UTC(협정세계시)를 나타내는 문자로 시간까지 표현할 때에는 반드시 사용해야 함.
    
YYYY-MM-DD
    
YYYY-MM
    
YYYY

      <!DOCTYPE html>
<html lang="ko">
    
<head>
	<meta charset="UTF-8">
	<title>JavaScript Date Format</title>
</head>
    
<body>
    
	<h1>ISO 날짜 양식</h1>
    
	<script>
		document.write(new Date("1977-12-14T13:30:00") + "<br>");	// 날짜와 시간까지 표현함.
		document.write(new Date("1977-12-14") + "<br>");			// 시간이 생략되면 자동으로 09:00:00으로 설정됨.
		document.write(new Date("1977-12") + "<br>");				// 일이 생략되면 자동으로 1일로 설정됨.
		document.write(new Date("1977"));							// 월이 생략되면 자동으로 1월로 설정됨.
	</script>
    	
</body>
    
</html>

      웹페이지 화면 ▼

      image-20220608161426446



    • Long 날짜 양식

    문법
MMM DD YYYY
  
DD MMM YYYY

    <!DOCTYPE html>
<html lang="ko">
  
<head>
	<meta charset="UTF-8">
	<title>JavaScript Date Format</title>
</head>
  
<body>
  
	<h1>Long 날짜 양식</h1>
  
	<script>
		document.write(new Date("Feb 19 1982") + "<br>");		// MMM DD YYYY
		document.write(new Date("19 Feb 1982") + "<br>");		// DD MMM YYYY
		document.write(new Date("February 19 1982") + "<br>");	// 월의 축약형 뿐만 아니라 전체 단어도 인식함.
		document.write(new Date("FEBRUARY, 19, 1982"));			// 쉼표는 무시되며, 대소문자의 구분은 없음.
	</script>
  	
</body>
  
</html>

    웹페이지 화면 ▼

    image-20220608161552533



    • Short 날짜 양식
    문법
MM/DD/YYYY
  
YYYY/MM/DD

    <!DOCTYPE html>
<html lang="ko">
  
<head>
	<meta charset="UTF-8">
	<title>JavaScript Date Format</title>
</head>
  
<body>
  
	<h1>Short 날짜 양식</h1>
  
	<script>
		document.write(new Date("02/19/1982") + "<br>");	// MM/DD/YYYY
		document.write(new Date("1982/02/19"));				// YYYY/MM/DD
	</script>
  	
</body>
  
</html>

    웹페이지 화면 ▼

    image-20220608161800929

    ★ ISO 날짜 양식과 short 날짜 양식에서는 반드시 월일 순서로 날짜가 나와야 하며, 일월 순서로 나온 날짜는 자바스크립트가 제대로 인식하지 못합니다.



    • Full 날짜 양식

    자바스크립트에서 사용하는 날짜 양식으로 표현된 문자열도 날짜로 인식합니다.

    Wed May 25 2016 17:00:31 GMT+0900

    <!DOCTYPE html>
<html lang="ko">
  
<head>
	<meta charset="UTF-8">
	<title>JavaScript Date Format</title>
</head>
  
<body>
  
	<h1>Full 날짜 양식</h1>
  
	<script>
		document.write(new Date("Wed May 25 2016 17:00:00 GMT+0900 (Seoul Time)") + "<br>");
		// GMT가 현재 국가와 다른 시간은 현재 국가의 GMT로 변환되어 표현됨.
		document.write(new Date("Wed May 25 2016 17:00:00 GMT-0500 (New York Time)"));
	</script>
  	
</body>
  
</html>

    웹페이지 화면 ▼

    image-20220608162036354

댓글남기기

참고

Tip03

1 분 소요

CLI Command 정리 명령어 간단 정리..