본문 바로가기
Javascript

Javascript - Date 내장함수

by DGK 2021. 9. 22.

 

인프런 자바스크립트 입문 수업을 듣고 중요한 내용을 정리했습니다.
개인 공부 후 자료를 남기기 위한 목적이므로 내용 상에 오류가 있을 수 있습니다.

 

Date 객체 내장함수

 

  • 기본 개념
Date 객체는 현재의 날짜와 시간을 알려주는 객체이다.
var d = new Date();

console.log(d);

// 결과 : Mon Sep 20 2021 07:49:52 GMT+0900

//GMT+0900은 utc 0을 기준으로 우리나라가 타임존이 9시간 빠르다는 것을 의미한다.



Date 객체를 사용하면 사용자가 원하는 날짜와 시간을 나타낼 수 있다.

var d = new Date(2021, 3, 27, 11, 14, 23) //년 월 일 시간 분 초

console.log(d);

// 결과 : Tue Apr 27 2021 11:14:23 GMT+0900

//단, 자바스크립트에서 월은 0부터 시작하며, (ex 3 : 4월, 0 : 1월)
//날짜는 1부터 시작한다. (ex 1 : 1일, 14 : 14일)

 

 

  • 내장함수
var d = new Date();

var year = d.getFullYear();
console.log("year", year);

// 결과 : 2021
//getFullYear는 연도를 가져오는 함수이다.


var month = d.getMonth();
console.log("month", month);

// 결과 : 8
//getMonth은 월을 가져오는 함수이다.(여기서 8은 8월이 아닌 9월을 뜻함)


var date = d.getDate();
console.log("date", date);

// 결과 : 20
//getDate는 일을 가져오는 함수이다.(getday 함수가 아님)


var day = d.getDay();
console.log("day", day);

// 결과 : 1
//getDay는 오늘이 무슨 요일인지 알려주는 함수이다. 
//일요일 0, 월요일 1, 화요일 2, 수요일 3, 목요일 4, 금요일 5, 토요일 6


var hour = d.getHours();
var minute = d.getMinutes();
var second = d.getSeconds();

//getHours, getMinutes, getSeconds 함수의 결과 값은
//사용자의 컴퓨터에 저장된 시간, 분, 초를 결과 값으로 준다.

//[참고사항]

//타임존 : 글로벌 서비스를 제공할 때 필요하다.
//데이터베이스에는 무조건 GMT+0 기준으로 년월일시간분초를 저장해야 한다.
//클라이언트 사이드에서 접속한 지역에 따라 알맞는 시간을 보여줘야 한다.(시차계산 필요)

//예를 들면, 한국에서 접속 시 GMT + 9, 중국에서 접속 시 GMT + 8을 
//데이터베이스에 저장된 시간(GMT+0)에 적용하여 시차가 계산된 시간을 보여줘야 한다.



//기타 내장함수

//타임존을 불러오는 함수

var d = new Date();
console.log("timezone", d.getTimezoneOffset());

// 결과 : -540
//-540은 분단위로 표현된 것이다.
//즉, -9시간을 의미하며, -9시간을 해야만 GMT+0의 시간이 될 수 있다는 것을 의미한다.



//utc 0 기준으로 년월일시간분초를 가져오는 함수

var utcYear = d.getUTCFullYear();
var utcMonth = d.getUTCMonth();
var utcdate = d.getUTCDate();
var utchour = d.getUTCHours();
var utcminute = d.getUTCMinutes();



//년월일시간분초를 강제로 세팅하는 함수

var d = new Date();
d.setFullYear(2020);		//2020년으로 연도를 강제 세팅
var year = d.getFullYear();     

console.log(year);

// 결과 : 2020
//월일시간분초도 동일하게 강제 세팅 할 수 있다.

 

 

  • 기타
실무에서는 자바스크립트의 Date 객체를 사용하기보다는 외부 라이브러리를 주로 사용한다.

<moment.js 라이브러리 사용 예시>
<!DOCTYPE html>
<html>
<head>
    <title>Document</title>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>
<body>
    <script>
    console.log(moment().format("YYYY-MM-DD"));
    // 결과 : 2021-09-20
    //YYYY-MM-DD의 포맷으로 변경 가능하다.
    
    console.log(moment().format("MMM DD, YYYY"));
    // 결과 : Sep 20, 2021
    //MMM DD, YYYY의 포맷으로 변경 가능하다.

    console.log(moment().subtract(7, "days").format("YYYY-MM-DD"));
    // 결과 : 2021-09-13
    //오늘 날짜에서 정확히 7일 이전의 날짜를 보여준다.(정확히 7일을 빼줌)
    
    console.log(moment().add(7, "days").format("YYYY-MM-DD"));
    // 결과 : 2021-09-27
    //오늘 날짜에서 정확히 7일 이후의 날짜를 보여준다.(정확히 7일을 더해줌)
    
    console.log(moment().add(4, "Hours").format("YYYY-MM-DD HH"));
    // 결과 : 2021-09-20 12
    //현재 시간으로부터 4시간 이후의 시간을 보여준다.(정확히 4시간을 더해줌) 


//이처럼 외부 라이브러리를 활용하면 사용자가 필요한 날짜와 시간 기능을 모두 사용할 수 있다.
    </script>
</body>
</html>

'Javascript' 카테고리의 다른 글

Javascript - JSON 객체  (0) 2021.09.22
Javascript - Math 내장함수  (0) 2021.09.22
Javascript - Array 내장함수  (0) 2021.09.21
Javascript - Boolean 내장함수  (0) 2021.09.21
Javascript - Number 내장함수  (0) 2021.09.19

댓글