Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Intl.DateTimeFormat returns an hour over 24

I have the following Unix timestamp: 1611328500000 (Fri Jan 22 2021 10:15:00 GMT-0500 (Eastern Standard Time)).

I need to display it in Korean Standard Time. To do so, I'm using Intl.DateTimeFormat. However, for some reason, the result I'm getting is 24:15 when I attempt to format it. Unless I'm delusional, I'm pretty sure that's higher than a 24-hour clock usually goes (0:00 to 23:59).

Google tells me my result should be 0:15, obviously on the following date (Sat Jan 22).

Here's a minimal working example:

const date = new Date(1611328500000);

const timeOptions = {
  hour12: false,
  hour: '2-digit',
  minute: '2-digit'
};

const formatter = new Intl.DateTimeFormat('en-US', {
  timeZone: 'Asia/Seoul', ...timeOptions
});

console.log(formatter.format(date));

Am I crazy? Can times go up to 24:15 in some circumstances? What is happening here?


EDIT: I just found this page which seems to be experiencing a similar problem. The answer provided there points me towards something called hourCycle, with a link to MDN's Intl.DateTimeFormat.

However, hourCycle only appears once on that page, in the browser support section. Adding the suggested hourCycle: h11 to my timeOptions did not work.

Digging further, I found this page, which lists h23 as a valid option. Surely this is what I'm after! But, alas... my result is still 24:15.

like image 657
matthew-e-brown Avatar asked Jan 06 '21 23:01

matthew-e-brown


People also ask

What is Intl DateTimeFormat () resolvedOptions () timezone?

The Intl. DateTimeFormat. prototype. resolvedOptions() method returns a new object with properties reflecting the locale and date and time formatting options computed during initialization of this Intl. DateTimeFormat object.

What is Intl in Javascript?

The Intl object is the namespace for the ECMAScript Internationalization API, which provides language sensitive string comparison, number formatting, and date and time formatting.

Is DateTime a format?

A standard date and time format string uses a single character as the format specifier to define the text representation of a DateTime or a DateTimeOffset value. Any date and time format string that contains more than one character, including white space, is interpreted as a custom date and time format string.


1 Answers

Switch from hour12: true to hourCycle: 'h23' to display the hours from 00:00 to 23:59.

const date = new Date(1611328500000);

const timeOptions = {
  hourCycle: 'h23',
  hour: '2-digit',
  minute: '2-digit'
};

const formatter = new Intl.DateTimeFormat('en-US', {
  timeZone: 'Asia/Seoul', ...timeOptions
});

console.log(formatter.format(date));
like image 52
Emiel Zuurbier Avatar answered Nov 15 '22 12:11

Emiel Zuurbier