자바스크립트 Date 객체와 toLocaleDateString(), toLocaleString()

자바스크립트의 Date 객체를 자주 다루면서, toLocaleDateString()과 toLocaleString()에 대해 알게 되었다. 먼저, Date 객체에 대해 알아보고 이후 메서드들을 살펴보겠다.

 

Date 객체

 

Date 객체 생성 방법은 어렵지 않다. 특정 날짜를 지정하여 다양한 방법으로 생성할 수 있다.

const now = new Date();
console.log(now); // 예: Wed Dec 31 2024 13:45:30 GMT+0900 (Korean Standard Time)

// YYYY-MM-DD 형식
const date1 = new Date("2024-12-31");

// MM/DD/YYYY 형식 (주의: 미국식)
const date2 = new Date("12/31/2024");

// 년, 월(0부터 시작), 일
const date3 = new Date(2024, 11, 31); // 11 = 12월

// 날짜와 함께 시간까지 지정할 수 있다.
const dateWithTime = new Date("2024-12-31T15:30:00");
console.log(dateWithTime); // Tue Dec 31 2024 15:30:00 GMT+0900 (Korean Standard Time)

 

Date 객체에서 연도 월, 일 등 정보를 추출할 수 있고, 반대로 지정할 수 있다.

const date = new Date("2024-12-31");

console.log(date.getFullYear()); // 2024 (연도)
console.log(date.getMonth());    // 11 (월: 0부터 시작, 11 = 12월)
console.log(date.getDate());     // 31 (일)
console.log(date.getDay());      // 2 (요일: 0 = 일요일, 1 = 월요일)
...

const date = new Date();
date.setFullYear(2025); // 연도를 2025로 변경
date.setMonth(0);       // 월을 1월로 변경 (0부터 시작)
date.setDate(15);       // 일을 15일로 변경
console.log(date);

 

toLocaleDateString()

 

toLocaleDateString()은 JavaScript의 Date 객체 메서드로, 날짜를 현지화된 문자열로 변환한다.

먼저, 이 메서드는 주어진 날짜를 사용자의 로캘(locale) 및 시간대에 따라 포맷된 날짜 문자열로 출력한다.

const date = new Date("2024-12-31");

console.log(date.toLocaleDateString("en-US")); // "12/31/2024"
console.log(date.toLocaleDateString("ko-KR")); // "2024. 12. 31."
console.log(date.toLocaleDateString("ja-JP")); // "2024/12/31"

 

또한, 옵션 객체를 사용하여 출력 형식을 더 세부적으로 제어할 수 있다.

year(numeric, 2-digit), month(numeric, 2-digit, short, long, narrow), day(numeric, 2-digit) 등

const date = new Date("2024-12-31");
console.log(
  date.toLocaleDateString("en-US", { year: "numeric", month: "long", day: "numeric", timeZoneName: "short" })
); // December 31, 2024 at GMT+9
console.log(
  date.toLocaleDateString("en-US", { year: "2-digit", month: "short", day: "numeric", timeZoneName: "long" })
); // Dec 31, 24, Korean Standard Time

 

toLocaleString()

 

위에서 한발짝 더 나아가서, toLocaleString()은 현재 로컬 시간대와 로캘에 따라 날짜와 시간 정보를 포맷된 문자열로 반환한다. 날짜와 시간을 함께 표시할 때 유용하며, 마찬가지로 다양한 옵션을 사용해 원하는 형식으로 맞춤 설정할 수 있다.

const now = new Date();

// 한국 시간 (Asia/Seoul)
const koreanTime = now.toLocaleString("en-US", { timeZone: "Asia/Seoul" });
console.log("한국 시간:", koreanTime); 
// 한국 시간: 12/31/2024, 5:39:49 PM

// 미국 동부 시간 (America/New_York)
const easternTime = now.toLocaleString("en-US", { timeZone: "America/New_York" });
console.log("미국 동부 시간:", easternTime);
// 미국 동부 시간: 12/31/2024, 3:39:49 AM

 

사용 방법 전부를 다루지는 못했지만, 이런 메서드들이 있다는 것을 알아두고 필요할때 마다 검색해서 사용하면 유용할 것 같다.