자바스크립트 날짜 함수, 비교, 포맷 변경 📅

자바스크립트에서 날짜와 시간을 다루는 Date 객체의 주요 기능들을 정리합니다. 날짜를 생성하고, 비교하며, 원하는 형식으로 바꾸는 방법을 예제 코드와 함께 알아봅니다.

날짜 함수 (Date 객체 생성)

자바스크립트에서 날짜 관련 작업을 하려면 먼저 Date 객체를 생성해야 합니다. 다양한 방법으로 객체를 생성할 수 있습니다.

현재 날짜 및 시간

가장 간단한 방법으로, 인수 없이 new Date()를 호출하면 현재 시스템의 날짜와 시간을 가지는 객체가 생성됩니다.


const now = new Date();

console.log(now); // 예: Tue Jun 10 2025 10:54:30 GMT+0900 (대한민국 표준시)

특정 날짜 및 시간 지정

문자열 또는 숫자 인수를 사용하여 특정 날짜를 지정할 수 있습니다.

날짜 문자열: YYYY-MM-DD 형식의 문자열로 날짜를 지정할 수 있습니다.

const dateFromString = new Date('2025-01-01');

console.log(dateFromString);

숫자 인수: 연, 월(0부터 시작), 일, 시, 분, 초, 밀리초 순서로 숫자를 전달하여 날짜를 지정할 수 있습니다. 월은 0(1월)부터 11(12월)까지의 값을 가집니다.

// 2025년 12월 25일

const christmas = new Date(2025, 11, 25, 10, 30, 0);
console.log(christmas);

주요 날짜 정보 가져오기

Date 객체는 날짜의 각 부분을 가져올 수 있는 다양한 메서드를 제공합니다.


const today = new Date();

console.log("연도: " + today.getFullYear());       // 예: 2025
console.log("월 (0-11): " + today.getMonth());    // 예: 5 (6월)
console.log("일: " + today.getDate());           // 예: 10
console.log("요일 (0-6): " + today.getDay());     // 예: 2 (화요일, 일요일=0)
console.log("시간: " + today.getHours());         // 예: 10
console.log("분: " + today.getMinutes());       // 예: 54

날짜 비교

두 날짜를 비교하여 어느 쪽이 더 빠르거나 늦는지, 또는 같은지 확인할 수 있습니다.

비교 연산자 사용

<, >, <=, >=와 같은 비교 연산자를 사용하여 두 Date 객체를 직접 비교할 수 있습니다. 이는 내부적으로 밀리초 단위의 타임스탬프 값을 비교하는 것입니다.


const date1 = new Date('2025-01-01');
const date2 = new Date('2025-12-31');
if (date1 < date2) {
console.log("date1이 date2보다 이전입니다.");
} else if (date1 > date2) {
console.log("date1이 date2보다 나중입니다.");
}

주의: ==, ===, !=, !== 연산자는 객체의 참조를 비교하므로, 날짜 값이 같더라도 다른 객체라면 false를 반환합니다. 따라서 날짜 값이 같은지 비교할 때는 타임스탬프를 사용해야 합니다.

`getTime()` 메서드 사용

getTime() 메서드는 1970년 1월 1일 00:00:00 UTC부터 현재까지의 시간을 밀리초로 반환합니다. 이 숫자 값을 비교하면 모든 비교(같음 포함)를 정확하게 수행할 수 있습니다.


const dateA = new Date('2025-06-10');
const dateB = new Date('2025-06-10');
// 잘못된 비교
console.log(dateA === dateB); // false
// 올바른 비교
console.log(dateA.getTime() === dateB.getTime()); // true

특정 날짜가 날짜 범위에 포함되는지 확인

날짜가 특정 시작일과 종료일 사이에 있는지 확인하려면, 각 날짜의 getTime() 값을 비교하는 것이 가장 명확하고 안전한 방법입니다. 확인하려는 날짜의 타임스탬프가 시작일의 타임스탬프보다 크거나 같고, 종료일의 타임스탬프보다 작거나 같은지 확인하면 됩니다.

함수로 구현하는 방법

이러한 로직을 재사용 가능한 함수로 만들면 편리합니다.

/**
 * 특정 날짜(date)가 시작일(min)과 종료일(max) 사이에 있는지 확인합니다.
 * @param {Date} date - 확인할 날짜
 * @param {Date} min - 범위 시작일
 * @param {Date} max - 범위 종료일
 * @returns {boolean} - 포함되면 true, 아니면 false
 */
   const isBetween = (date, min, max) => (
   		date.getTime() >= min.getTime() && date.getTime() <= max.getTime()
   );
   
// --- 사용 예제 ---
// 날짜 범위 설정 (2025년 6월 1일 ~ 2025년 6월 30일)
const startDate = new Date('2025-06-01');
const endDate = new Date('2025-06-30');

// 확인할 날짜
const targetDate1 = new Date('2025-06-15'); // 범위에 포함됨
const targetDate2 = new Date('2025-07-10'); // 범위에 포함되지 않음

// 결과 확인
console.log(2025-06-15는 범위 내에 있는가? , isBetween(targetDate1, startDate, endDate)); // true
console.log(2025-07-10는 범위 내에 있는가? , isBetween(targetDate2, startDate, endDate)); // false

날짜 포맷 변경

Date 객체를 사용자가 읽기 쉬운 형식이나 특정 표준 형식(예: YYYY-MM-DD)의 문자열로 변환할 수 있습니다.

기본 제공 메서드

toString(): 브라우저의 시간대 기준으로 전체 날짜와 시간 문자열을 반환합니다.
toDateString(): 날짜 부분만 사람이 읽기 쉬운 형태로 반환합니다.
toLocaleDateString(): 브라우저의 로케일(지역 설정)에 맞는 날짜 문자열을 반환합니다.
toISOString(): ISO 8601 표준 형식(YYYY-MM-DDTHH:mm:ss.sssZ)으로 변환합니다. UTC 기준입니다.

const today = new Date();

console.log(today.toString());          // 예: Tue Jun 10 2025 10:54:30 GMT+0900 (...)
console.log(today.toDateString());      // 예: Tue Jun 10 2025
console.log(today.toLocaleDateString('ko-KR')); // 예: 2025. 6. 10.
console.log(today.toISOString());       // 예: 2025-06-10T01:54:30.123Z

사용자 지정 형식 (YYYY-MM-DD)

원하는 형식으로 날짜를 표현하려면, 날짜 구성 요소를 각각 가져와 조합해야 합니다.

function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 월은 0부터 시작하므로 1을 더하고, 두 자리로 만듭니다.
const day = String(date.getDate()).padStart(2, '0');       // 날짜를 두 자리로 만듭니다.

return `${year}-${month}-${day}`;

}
const today = new Date();
const formattedDate = formatDate(today);
console.log(formattedDate); // 예: 2025-06-10

padStart() 함수는 문자열의 시작 부분을 다른 문자열로 채워, 주어진 길이를 만족하는 새로운 문자열을 반환합니다. 월이나 일이 한 자리 수일 때 앞에 '0'을 붙이는 데 유용합니다.

`toLocaleDateString()` 옵션 활용

toLocaleDateString() 메서드에 옵션을 전달하여 좀 더 유연하게 형식을 지정할 수 있습니다.


const today = new Date();
const options = {
year: 'numeric',
month: 'long',
day: 'numeric',
weekday: 'long'
};
console.log(today.toLocaleDateString('ko-KR', options)); // 예: 2025년 6월 10일 화요일
console.log(today.toLocaleDateString('en-US', options)); // 예: Tuesday, June 10, 2025