[JavaScript] Date() 현재 날짜 시간 yyyy-mm-dd hh:mm:ss 포맷

날짜와 시간은 정말 자주 사용되는 개념이며, 자바스크립트에서는 Date() 객체를 사용하여 쉽게 정보를 얻고 활용할 수 있습니다.

본 포스팅에서는 Date() 객체의 전반적인 사용 방법과 메서드를 이용한 포맷팅 방법에 대해 다루어 보겠습니다.

Date 객체 기본 사용법

생성

먼저 Date 객체를 생성하는 방법은 여러가지가 있습니다.

const date = new Date();
console.log(`1.${date}`);

const date2 = new Date(0);
console.log(`2.${date2}`);

const date3 = new Date("Oct 21, 2000 13:12:10");
console.log(`3.${date3}`);

const date4 = new Date(2000, 9, 21, 15, 30, 30, 0);
console.log(`4.${date4}`);

const date5 = Date();
console.log(`5.${typeof date5}`);

결과값:

1. 현재 시간을 나타내는 Date 객체를 반환합니다.

2. 매개변수로 milliseconds(밀리초)를 의미하는 숫자를 넣어주면 1970년 1월 1일 00:00 (UTC)를 기준으로 밀리초만큼 경과한 날짜와 시간을 나타내는 Date 객체를 반환합니다.

0을 넣었기 때문에 기준이 되는 날짜와 시간이 나옵니다. (GMT+9:00는 한국 표준시로 UTC에서 9시간 더한 시간)

3. “Oct 21, 2000 13:12:10″와 같이 날짜와 년도 시간을 문자열 매개변수로 넣어주면 그에 맞는 시간을 나타내는 Date 객체를 반환합니다.

4. 순서대로 년도, 월, 일, 시, 분, 초, 밀리초를 의미하는 숫자들을 매개변수로 넣어주면 그에 맞는 시간을 나타내는 Date객체를 반환합니다.

년도와 월은 반드시 지정해야하며 지정하지 않은 시간 단위는 자동으로 0 또는 1로 지정됩니다. 년도와 월을 지정하지 않으면 1970년 1월 1일 00:00 (UTC)로 지정됩니다.

하나 주의해야할 점은 월은 0부터 시작하기 때문에 위에서 9를 넣었지만 결과값은 10월로 나왔습니다.

년도: 1900이상, 월: 0 ~ 11, 일: 1 ~ 31, 시: 0 ~ 23, 분: 0 ~ 59, 초: 0 ~ 59, 밀리초: 0 ~ 999

5. new 키워드를 사용하지 않고 Date 객체를 생성하면 object가 아닌 string 문자열을 반환합니다.

메서드

모든 Date 메서드는 MDN에서 잘 정리되어있다고 생각되어 참조하겠습니다.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Date

개중 많이 쓰이는 메서드 몇 정리해보자면,

현재 날짜 시간 구하기

다음과 같은 방법으로 현재 날짜와 시간을 구할 수 있습니다. UTC 시간을 출력하며, Date 객체이기 때문에 자료형은 object입니다.

const timeNow = new Date();

console.log(timeNow); // 2023-11-16T14:05:33.577Z
console.log(typeof timeNow); // object

다음과 같이 toString 메서드를 사용하면, 문자열 형태로 현재 시간을 UTC가 아닌 UTC보다 9시간 더해진 한국 표준시 KST(GMT+09:00)로 받아볼 수 있습니다.

const timeNow = new Date(); 

console.log(timeNow.toString()); // Thu Nov 16 2023 23:07:51 GMT+0900 (GMT+09:00)
console.log(typeof timeNow.toString()); // string

yyyy-mm-dd 날짜 포맷팅

Date 객체를 이용하여 날짜를 구해보면 지저분하게 길게 나오는 것을 볼 수 있습니다.

다음과 같은 방법으로 깔금하게 yyyy-mm-dd 문자열 형식으로 날짜를 포맷팅할 수 있습니다.

const timeNow = new Date();

const formatted =
timeNow.getFullYear() +
  "-" +
  (timeNow.getMonth() + 1) +
  "-" +
  timeNow.getDate();
  
console.log(formatted); // 2023-11-16
console.log(typeof formatted); // string

getMonth 메서드의 반환값인 월은 0 ~ 11 (1월 ~ 12월)을 반환하기 때문에 1을 더해야 정확한 월이 됩니다.

hh:mm:ss 시간 포맷팅

마찬가지로 Date 객체를 이용하여 시간을 구해보면 지저분하게 길게 나오는 것을 볼 수 있습니다.

다음과 같은 방법으로 깔금하게 hh:mm:ss 문자열 형식으로 시간을 포맷팅할 수 있습니다.

const timeNow = new Date();

const formatted =
  timeNow.getHours() + ":" + timeNow.getMinutes() + ":" + timeNow.getSeconds();

console.log(formatted); // 23:24:31
console.log(typeof formatted); // string