Intl

Intl

Internationalization(다국어 지원)을 담당하는 JavaScript의 Internationalization API, 일명 INTL은 다양한 언어와 지역 설정에서 일관된 방식으로 텍스트, 날짜, 숫자 등을 처리하고 표시하는 기능을 제공하는 API이다. INTL의 기본 개념부터 각 기능의 사용법에 이르기까지 살펴보자.

주요 개념

Locale

• 개념 - 로케일은 언어 및 지역 설정을 나타내며, 특정 문화적인 규칙과 관행에 따라 텍스트와 데이터를 형식화하는 데 사용된다.
• 'en-US'는 미국에서 사용되는 영어로케일을 나타내며, 한국은 'ko-kR' 이다.

Intl

• Intl은 Internationalization API를 나타내는 전역 객체이다.
• 다양한 기능을 사용하기 위해 Intl 객체의 하위 객체와 함수를 활용한다.

Intl.DateTimeFormat(날짜 및 시간)

• 날짜와 시간을 로케일에 맞게 표시하기 위한 객체이다.
• 세계적으로 날짜와 시간을 표기하는 방법은 다르다. 한국에서는 연, 월, 일, 요일 순서를 따르지만 영어에서는 요일, 월, 일, 년 순서를 따른다.
• 시간을 표시할 때도, 한국어에서는 오전 오후를 제일 앞에 명시하는 반면에 영어에서는 이것을 보통 제일 뒤에 명시한다. Intl.DateTimeFormat 은 이러한 포멧 형식을 설정할 수 있는 옵션을 제공해준다.

// 현재 날짜와 시간을 생성
let date = new Date();			 

//  현재 시간에 맞게 포맷 문자열 추출 ('예시 출력: "2024년 2월 29일 화요일 14:30:45')
let formattedDate = new Intl.DateTimeFormat('ko-KR', { 
  weekday: 'long', 
  year: 'numeric',
  month: 'long', 
  day: 'numeric', 
  hour: 'numeric',
  minute: 'numeric', 
  second: 'numeric', 
  hour12: false 
};).format(date);

DateTimeFormat 옵션

Intl.DateTimeFormat의 옵션들은 날짜 및 시간을 형식화하는 방법을 지정한다. 다양한 옵션을 사용하여 원하는 형식으로 날짜 및 시간을 표시할 수 있다. 아래는 몇 가지 주요 옵션에 대해 살펴보자.

1. weekday (요일):
   'narrow' : 요일을 짧게 표시 ('월')
   'short' : 요일을 축약하여 표시 ('월요일')
   'long': 요일을 전체로 표시 ('월요일')

2. year (년도):
   'numeric': 전체 년도를 표시 ('2024')
   '2-digit': 년도를 뒤에 2자리로 표시 ('24')

3. month (월):
   'numeric': 숫자로 월을 표시 ('2')
   '2-digit': 두 자리 숫자로 월을 표시 ('02')
   'short': 축약된 형태로 월을 표시 ('2월')
   'long': 전체 월 이름을 표시 ('2월')

4. day (일):
   'numeric': 숫자로 일을 표시 ('3')
   '2-digit': 두 자리 숫자로 일을 표시 ('03')

5. hour (시간):
   'numeric': 숫자로 시간을 표시 ('9')
   '2-digit': 두 자리 숫자로 시간을 표시 ('09')

6. minute (분):
   'numeric': 숫자로 분을 표시 (e.g., '2')
   '2-digit': 두 자리 숫자로 분을 표시 (e.g., '02')

7. second (초):
   'numeric': 숫자로 초를 표시 (e.g., '5')
   '2-digit': 두 자리 숫자로 초를 표시 (e.g., '05')

8. hour12 (12시간 형식):
   true: 12시간 형식으로 시간을 표시 ('오후 2:30")
   false: 24시간 형식으로 시간을 표시 ('14:30')