Intl.DateTimeFormat

JavaScript course · Intermediate · Lesson 115/134

Learn locale-aware date formatting with Intl.DateTimeFormat.

Intl.DateTimeFormat

Intl.DateTimeFormat formats dates for a specific language and locale. It takes a locale code and an options object.

const fmt = new Intl.DateTimeFormat('en-US', {
  weekday: 'long',
  day: 'numeric',
  month: 'long'
});
fmt.format(new Date());

The options object decides which parts appear. weekday: 'long' gives the full day name and numeric gives a number. You can reuse one formatter for many dates.

The time zone option

The timeZone option shows the date in another time zone. The default is the user's zone.

new Intl.DateTimeFormat('en-US', {
  timeZone: 'Asia/Tokyo',
  hour: 'numeric',
  minute: 'numeric'
}).format(new Date());

This gives the time in Tokyo. Time zone names use the IANA form, for example 'Europe/Istanbul' or 'UTC'. This way users in different regions see the correct time.

Exercise Build a locale formatter

Assign new Intl.DateTimeFormat('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }) to fmt. Then log the result of fmt.format(today) with console.log.

Show example solution

Intl.DateTimeFormat builds a formatter; the options decide which parts appear. The format method returns the date as a string.
Example solution:
const today = new Date();
const fmt = new Intl.DateTimeFormat('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });
console.log(fmt.format(today));

Test yourself

What does new Intl.DateTimeFormat('en-US').format(date) return?
```
new Intl.DateTimeFormat('en-US').format(new Date())
```
- A Turkish-formatted date
- ISO format
- A timestamp
- A US-formatted date
Show answer

A US-formatted date — Correct! The 'en-US' locale gives a date string in US format.

Complete the options object

const fmt = new Intl.DateTimeFormat('en-US', { ____, year: 'numeric' });
console.log(fmt.format(new Date()));

Show answer

const fmt = new Intl.DateTimeFormat('en-US', { weekday: 'long', year: 'numeric' });
console.log(fmt.format(new Date()));

Match the options keys

weekday

weekday name
year

year
month

month
hour

hour

Intl.DateTimeFormat