[ Intl.DateTimeFormat ] 날짜와 시간을 로케일(지역) 및 특정 형식에 따라 포맷하기

1. Intl.DateTimeFormat 이란?

: ECMAScript Internationalization API의 일부로, 날짜와 시간을 로케일(지역) 및 특정 형식에 따라 포맷할 수 있는 기능을 제공합니다. 이를 사용하면 사용자가 선호하는 언어나 문화적 관습에 따라 날짜와 시간을 표시할 수 있습니다.

 

2. 주요 특징

1. 로케일 지원: Intl.DateTimeFormat은 다양한 로케일(ko-KR, en-US, fr-FR 등)을 지원하여 지역에 따라 맞춤화된 형식을 제공합니다.

2. 유연한 포맷 옵션: 날짜, 시간, 또는 둘 다 표시하도록 세부적으로 설정할 수 있습니다.

3. 자동화된 포맷: 복잡한 포맷팅 작업 없이 간단한 설정으로 날짜와 시간을 출력합니다.

 

3. 사용 방법

const formatter = new Intl.DateTimeFormat(locale, options);

 

- locale (옵션): 날짜 및 시간을 표현할 로케일 (예: 'en-US', 'ko-KR'). 생략 시 기본 로케일이 사용됩니다.

- options (옵션): 날짜 및 시간의 포맷을 지정하는 객체입니다.

 

4. 주요 옵션

options 객체에 포함되는 주요 속성은 다음과 같습니다.

 

날짜 관련 옵션

옵션	값	설명
year	'numeric', '2-digit'	연도 표시 (2025 또는 25)
month	'numeric', '2-digit', 'long', 'short', 'narrow'	월 표시 (1, 01, January, Jan, J)
day	'numeric', '2-digit'	일 표시 (6 또는 06)

 

시간 관련 옵션

옵션	값	설명
hour	'numeric', '2-digit'	시간 표시 (1 또는 01)
minute	'numeric', '2-digit'	분 표시 (5 또는 05)
second	'numeric', '2-digit'	초 표시 (9 또는 09)
hour12	true, false	12시간제(AM/PM) 또는 24시간제

 

기타 옵션

옵션	값	설명
weekday	'long', 'short', 'narrow'	요일 표시 (Monday, Mon, M)
timeZone	'UTC', 'Asia/Seoul' 등	특정 시간대를 지정
timeZoneName	'short', 'long'	시간대 이름 표시 (GMT, Greenwich Mean Time)

 

 

5. 실제 적용

- 적용전

 

- 적용후