2 분 소요

자바스크립트 Date 객체 메소드와 날짜 포맷 변환·한국 시간(Asia/Seoul) 타임존 처리는 웹 개발에서 자주 겪는 과제입니다. 이 글에서는 getFullYear()·setMonth() 같은 기본 메소드부터 Intl.DateTimeFormat·toLocaleString() 활용법까지 단계별로 정리했습니다.

Date 객체 핵심 메소드 모음

자주 쓰는 Getter 메소드

메소드 반환값 예시
getFullYear() 4자리 연도 today.getFullYear() → 2025
getMonth() 월(0-11) today.getMonth() → 5 (6월)
getDate() 일(1-31) today.getDate() → 3
getDay() 요일(0=일) today.getDay() → 2 (화)
getHours() 시(0-23) today.getHours()
getMinutes() / getSeconds() 분·초  

Tip: 한국 시간을 얻으려면 toLocaleString(“ko-KR”) 를 쓰면 출력이 자동으로 KST(UTC+9)로 변환됩니다.

Setter 메소드로 날짜 조작하기

const d = new Date(); // 오늘
d.setFullYear(2030); // 연도 변경
d.setMonth(11); // 12월 (0부터 시작)
d.setDate(25); // 25일
  • 월·일을 초과하면 자동으로 반영됩니다.
    new Date(2025, 0, 32) → 2025-02-01

YYYY-MM-DD 포맷 손쉽게 만들기

1. 전통적 패드(pad) 방식

function toYMD(date) {
  const y = date.getFullYear();
  const m = String(date.getMonth() + 1).padStart(2, "0");
  const d = String(date.getDate()).padStart(2, "0");
  return `${y}-${m}-${d}`;
}
toYMD(new Date()); // "2025-06-03"

2. 국제화 API 활용(권장)

const ymd = new Intl.DateTimeFormat("sv-SE", {
  dateStyle: "short", // ISO-like "2025-06-03"
}).format(new Date());
  • "sv-SE"(스웨덴) 로케일은 YYYY-MM-DD 형식을 기본으로 제공합니다.

KST(한국 시간) ↔ UTC 변환법

현지(KST) → UTC 타임스탬프

const kstDate = new Date(); // 현지 KST
const utcMillis = kstDate.getTime() - 9 * 60 * 60 * 1000;
const utcDate = new Date(utcMillis);

UTC ISO 문자열 → 한국 시간 객체

const utcStr = "2025-12-31T15:00:00Z";
const utc = new Date(utcStr); // 내부 저장은 UTC
const kst = new Date(utc.getTime() + 9 * 60 * 60 * 1000);
kst.toLocaleString("ko-KR"); // "2026. 1. 1. 오전 0:00:00"

숙지하세요! Date 인스턴스는 내부적으로 항상 UTC 기준 밀리초를 보관하며, 표시 단계에서 로컬 타임존으로 변환됩니다.

타임존 안전하게 표시하기 – Intl.DateTimeFormat

const fmtKR = new Intl.DateTimeFormat("ko-KR", {
  timeZone: "Asia/Seoul",
  dateStyle: "full",
  timeStyle: "medium",
});
fmtKR.format(new Date("2025-10-09T12:00:00Z"));
// "2025년 10월 9일 목요일 오후 9:00:00"
옵션 값 설명
timeZone "Asia/Seoul" 등 IANA ID 원하는 지역 시간대 지정
dateStyle / timeStyle "short", "medium", "full" 간단한 포맷 프리셋
개별 옵션 year, month, day, hour, … 세밀한 커스터마이즈

날짜 간 차이 계산 – 일·시·분·초

function diffInDays(a, b) {
  const msPerDay = 86_400_000; // 1000*60*60*24
  return Math.floor((b - a) / msPerDay);
}

const start = new Date("2025-06-03");
const end = new Date("2025-12-31");
diffInDays(start, end); // 211
  • 밀리초 차이로 구한 뒤 원하는 단위(일·시·분)로 나누기
  • 순간 순간의 서머타임 차이를 고려하려면 Temporal API(Stage-3) 혹은 날짜 라이브러리를 사용하세요.

실전 꿀팁 3가지

  1. 불변 업데이트: 날짜 계산 시 setMonth를 직접 호출하기보다 new Date(oldDate)로 복사 후 수정하면 원본 훼손을 방지할 수 있습니다.
  2. 범위 체크: 사용자 입력은 isNaN(Date.parse(str))로 유효성 검사를 하고, 잘못된 날짜는 Toast 알림으로 즉시 안내하세요.
  3. 라이브러리 선택: 다국어·타임존이 복잡한 대형 서비스는 Luxon·Day.js (UTC 플러그인)로 유지 보수성을 확보하세요.

질문 정리

Q1. getMonth() 결과가 5인데 왜 6월인가요?

A. 월 인덱스는 0부터 11까지입니다. 0 = 1월, 5 = 6월.

Q2. new Date("2025-02-30")은 어떻게 되나요?

A. 잘못된 날짜는 자동 보정되어 3월 2일로 변환됩니다. 사용자 입력 검증이 필요합니다.

Q3. 서버 UTC 시간 문자열을 그대로 화면에 보여도 되나요?

A. 사용자 경험을 위해 Intl.DateTimeFormat 또는 toLocaleString("ko-KR")로 로컬 시간대 변환 후 표시하세요.

Q4. 한국에서 DST(서머타임)를 고려해야 하나요?

A. 현재 KST(UTC+9)는 서머타임을 사용하지 않지만, 다국적 앱이라면 다른 타임존에 대비해 IANA 타임존 표기법을 사용하세요.

Q5. Temporal API는 언제 쓰나요?

A. ECMAScript Stage-3 제안으로, 타임존·달력 지원이 풍부합니다. Day.js Temporal 플러그인이나 Polyfill로 미리 체험할 수 있습니다.

카테고리:

업데이트:

댓글남기기

참고