Apidog

올인원 협업 API 개발 플랫폼

API 설계

API 문서

API 디버깅

API 모킹

API 자동화 테스트

자바스크립트의 시간 날짜 API가 정말 좋은 이유:

Young-jae

Young-jae

Updated on March 1, 2025

💡
시작하기 전에 간단한 안내 말씀 드리겠습니다: 오늘 무료로 Apidog를 다운로드하여 API 테스트 프로세스를 간소화하고, 특히 Claude 3.7 Sonnet의 강력한 기능을 탐색해 보세요—최신 AI 모델을 테스트하려는 개발자에게 완벽합니다!
버튼

날짜와 시간을 다루는 것은 오랫동안 JavaScript 개발자에게 어려운 문제였습니다. 기존의 Date 객체는 특성과 한계로 인해 많은 개발자들이 Moment.js 또는 date-fns와 같은 서드파티 라이브러리로 이동하게 했습니다. 그러나 JavaScript의 발전을 책임지고 있는 TC39 위원회는 해결책을 위해 노력하고 있습니다: Temporal API. 이 포괄적이고 현대적인 접근 방식은 날짜와 시간 처리의 오랜 문제를 해결할 것을 약속합니다.

JavaScript의 Date 객체 문제점

Temporal API를 다루기 전에 현재의 Date 객체의 한계를 이해하는 것이 중요합니다:

  1. 변경 가능한 상태: Date 객체는 제자리에서 수정할 수 있어 예기치 않은 부작용을 초래할 수 있습니다.
  2. 제한된 기능: 날짜를 더하거나 비교하는 간단한 작업조차 복잡한 코드를 요구합니다.
  3. 문자열 파싱 불일치: 문자열에서 날짜를 파싱하는 것은 브라우저 간에 신뢰할 수 없습니다.
  4. 타임존 지원 없음: UTC와 로컬 시간을 넘어서는 타임존 처리가 부족합니다.
  5. 그레고리력만 지원: 다른 달력 시스템에 대한 지원이 없습니다.
  6. 혼란스러운 API: getMonth()와 같은 메서드는 0으로 시작하는 값을 반환합니다 (1-12 대신 0-11).

이러한 문제는 JavaScript에서 날짜를 다루는 것이 오류를 초래하기 쉽고 짜증나게 했으며, 서드파티 라이브러리의 광범위한 채택으로 이어졌습니다.

Temporal API 소개

Temporal API는 날짜와 시간을 다루기 위한 현대적이고 포괄적인 솔루션을 제공하는 JavaScript의 제안된 추가 기능입니다. 전역 객체(Temporal)로 설계되어 다양한 날짜와 시간 작업을 위한 다양한 클래스를 포함하는 최상위 네임스페이스 역할을 합니다.

Temporal API의 주요 원칙은 다음과 같습니다:

  1. 불변성: 모든 Temporal 객체는 불변이며 부작용을 제거합니다.
  2. 명확성: 다른 종류의 날짜/시간 개념 간의 명확한 구분을 제공합니다.
  3. 타임존 지원: 모든 타임존에 대한 일급 지원을 포함하여 일광 절약 시간(DST) 안전한 산술을 제공합니다.
  4. 여러 달력 시스템: 비그레고리력에 대한 지원을 포함합니다.
  5. 정밀성: 시간 계산을 위한 나노초 정밀성을 지원합니다.
  6. 일관성: 표준화된 파싱 및 형식을 제공합니다.

Temporal API의 주요 데이터 유형

Temporal API는 날짜와 시간을 다루기 위한 여러 전문 클래스를 도입합니다:

단순 데이터 유형 (타임존 정보 없음)

  1. Temporal.PlainDate: 시간 또는 타임존 정보 없이 캘린더 날짜를 나타냅니다 (예: 2006년 8월 24일).
  2. Temporal.PlainTime: 날짜 또는 타임존 없이 벽시계 시간을 나타냅니다 (예: 오후 7시 39분).
  3. Temporal.PlainDateTime: 시간대 정보 없이 날짜와 벽시계 시간을 결합합니다.
  4. Temporal.PlainYearMonth: 특정 연도와 월을 나타냅니다 (예: 2020년 10월).
  5. Temporal.PlainMonthDay: 연도 없이 월과 일을 나타냅니다 (예: 7월 14일).

타임존 정보가 있는 Zoned 데이터 유형

  1. Temporal.ZonedDateTime: 특정 지역의 관점에서 특정 시간에 발생하는 실제 이벤트를 나타내는 타임존 인식, 캘린더 인식 날짜/시간 객체입니다.
  2. Temporal.Instant: 캘린더나 위치와 관계없이 고정된 시점을 나타냅니다 (정확한 시간).

추가 유형

  1. Temporal.Duration: 시점의 길이를 나타냅니다 (예: 5분 30초).
  2. Temporal.TimeZone: 타임존을 나타내고 변환 메서드를 제공합니다.
  3. Temporal.Calendar: 달력 시스템을 나타냅니다.

Temporal API 사용하기

Temporal 객체 생성하기

Temporal API는 여러 가지 방법으로 객체를 생성할 수 있습니다:

// 현재 날짜와 시간 가져오기
const now = Temporal.Now.plainDateTimeISO();
console.log(now.toString()); // 예: 2023-08-24T14:30:45.123456789

// 날짜만
const today = Temporal.Now.plainDateISO();
console.log(today.toString()); // 예: 2023-08-24

// 시간만
const currentTime = Temporal.Now.plainTimeISO();
console.log(currentTime.toString()); // 예: 14:30:45.123456789

// 구성 요소에서 객체 생성하기
const date = Temporal.PlainDate.from({ year: 2023, month: 8, day: 24 });
const time = Temporal.PlainTime.from({ hour: 14, minute: 30, second: 45 });
const dateTime = Temporal.PlainDateTime.from({
  year: 2023,
  month: 8,
  day: 24,
  hour: 14,
  minute: 30,
  second: 45
});

// ISO 문자열에서 생성하기
const dateFromString = Temporal.PlainDate.from("2023-08-24");
const timeFromString = Temporal.PlainTime.from("14:30:45");
const dateTimeFromString = Temporal.PlainDateTime.from("2023-08-24T14:30:45");

타임존 다루기

Temporal API는 타임존 작업을 훨씬 쉽게 만들어줍니다:

// 로컬 타임존의 현재 시간
const localTime = Temporal.Now.zonedDateTimeISO();
console.log(localTime.toString()); 
// 예: 2023-08-24T14:30:45+01:00[Europe/London]

// 특정 타임존의 현재 시간
const tokyoTime = Temporal.Now.zonedDateTimeISO("Asia/Tokyo");
console.log(tokyoTime.toString()); 
// 예: 2023-08-24T22:30:45+09:00[Asia/Tokyo]

// 타임존 간 변환
const nyTime = localTime.withTimeZone("America/New_York");
console.log(nyTime.toString()); 
// 예: 2023-08-24T09:30:45-04:00[America/New_York]

날짜 및 시간 산술

Temporal API의 가장 강력한 기능 중 하나는 직관적인 산술 연산입니다:

// 시간 더하기
const tomorrow = today.add({ days: 1 });
const nextWeek = today.add({ days: 7 });
const twoHoursLater = currentTime.add({ hours: 2 });

// 시간 빼기
const yesterday = today.subtract({ days: 1 });
const lastWeek = today.subtract({ days: 7 });
const twoHoursEarlier = currentTime.subtract({ hours: 2 });

// 기간 다루기
const duration = Temporal.Duration.from({ hours: 2, minutes: 30 });
const laterTime = currentTime.add(duration);

// 두 날짜 간의 차이 찾기
const date1 = Temporal.PlainDate.from("2023-01-01");
const date2 = Temporal.PlainDate.from("2023-08-24");
const difference = date1.until(date2);
console.log(difference.toString()); // P236D (ISO 8601 기간 형식)
console.log(difference.days); // 236

"with"로 구성 요소 수정하기

Temporal API는 수정된 구성 요소로 새로운 객체를 생성하는 간단한 방법을 제공합니다:

// 날짜의 연도 변경하기
const nextYear = date.with({ year: date.year + 1 });

// 특정 구성 요소 설정하기
const newDateTime = dateTime.with({ hour: 12, minute: 0, second: 0 });
console.log(newDateTime.toString()); // 2023-08-24T12:00:00

Temporal 객체 비교하기

API는 직관적인 비교 메서드를 제공합니다:

const date1 = Temporal.PlainDate.from("2023-08-24");
const date2 = Temporal.PlainDate.from("2023-09-15");

console.log(date1.equals(date2)); // false
console.log(date1.equals(date1)); // true
console.log(date1.before(date2)); // true
console.log(date1.after(date2)); // false
console.log(date1.since(date2).days); // -22

DST 및 모호한 시간 다루기

Temporal API는 일광 절약 시간(DST) 전환의 복잡성을 우아하게 처리합니다:

// DST 전환 중에 해당하는 시간 생성하기
const dstTime = Temporal.ZonedDateTime.from({
  timeZone: "America/New_York",
  year: 2023,
  month: 11,
  day: 5,
  hour: 1,
  minute: 30
});

// API는 모호한 시간을 처리하는 방법을 지정할 수 있게 해줍니다
const dstTimeExact = Temporal.ZonedDateTime.from({
  timeZone: "America/New_York",
  year: 2023,
  month: 11,
  day: 5,
  hour: 1,
  minute: 30,
  disambiguation: "earlier" // 옵션: 'earlier', 'later', 'compatible', 'reject'
});

비그레고리력 지원

Date 객체와 달리, Temporal API는 여러 달력 시스템을 지원합니다:

// 히브리력에서 날짜 생성하기
const hebrewDate = Temporal.PlainDate.from({
  year: 5783,
  month: 5,
  day: 15,
  calendar: "hebrew"
});

// 달력 시스템 간 변환하기
const gregorianDate = hebrewDate.withCalendar("iso8601");

파싱 및 형식 지정

Temporal API는 파싱 및 형시 지정 메서드를 제공합니다:

// 문자열에서 파싱하기
const date = Temporal.PlainDate.from("2023-08-24");

// 사용자 정의 형식 지정
const options = {
  year: 'numeric',
  month: 'long',
  day: 'numeric'
};
console.log(date.toLocaleString("en-US", options)); // 2023년 8월 24일

현재 상태 및 브라우저 지원

작성 시점에서 Temporal API는 TC39 제안 프로세스에서 3단계에 있으며, 이는 거의 완료되었지만 공식 ECMAScript 표준의 일부는 아닙니다. 기본적인 브라우저 지원은 여전히 대기 중이지만, 개발자는 @js-temporal/polyfill과 같은 폴리필을 사용하여 오늘 이 API를 사용할 수 있습니다:

// 폴리필 설치하기
// npm install @js-temporal/polyfill

// 코드에서 사용하기
import { Temporal } from "@js-temporal/polyfill";

const now = Temporal.Now.plainDateTimeISO();

결론

Temporal API는 JavaScript의 날짜 및 시간 처리 기능에 중대한 개선을 의미합니다. Date 객체의 오랜 문제를 해결하고 포괄적이고 직관적인 API를 제공함으로써, JavaScript에서 시간 개념을 다루는 것이 훨씬 더 쾌적하고 오류를 줄여줄 것을 약속합니다.

Temporal API의 주요 이점은 다음과 같습니다:

  1. 불변성: 모든 연산은 새로운 객체를 반환하여 부작용을 방지합니다.
  2. 명확성: 서로 다른 날짜와 시간 간의 명확한 구분을 제공합니다.
  3. 포괄성: 단순 날짜부터 복잡한 타임존 인식 연산까지 모두 다룹니다.
  4. 직관적: add(), subtract(), with()와 같은 메서드로 일반적인 작업을 간단하게 수행할 수 있습니다.
  5. 정확성: 나노초 정밀성을 지원합니다.
  6. 전 세계적: 여러 타임존과 달력 시스템을 지원합니다.

브라우저가 이 API를 기본적으로 구현할 때까지 기다리는 동안, 폴리필을 사용하여 개발자는 오늘 이 개선의 혜택을 누릴 수 있습니다. 웹 애플리케이션이 점점 더 글로벌하고 시간에 민감해짐에 따라, Temporal API는 모든 JavaScript 개발자 도구 세트의 필수 도구가 되어 기본적인 날짜 및 시간 작업을 위해 외부 라이브러리를 사용하는 필요성을 종식시킬 것입니다.

Temporal API를 수용함으로써, 개발자들은 날짜, 시간 및 타임존의 복잡성을 올바르게 처리하는 더 깔끔하고 유지 관리가 용이한 코드를 작성할 수 있으며, 이는 전 세계적으로 더 나은 사용자 경험을 제공합니다.

버튼