Web/JavaScript/Reference/Global objects/Intl/Locale/hourCycle

From Get docs


The Intl.Locale.prototype.hourCycle property is an accessor property that returns the time keeping format convention used by the locale.

Description

There are 2 main types of time keeping conventions (clocks) used around the world: the 12 hour clock and the 24 hour clock. The hourCycle property makes it easier for JavaScript programmers to access the clock type used by a particular locale. Like other additional locale data, hour cycle type is an extension subtag, which extends the data contained in a locale string. The hour cycle type can have several different values, which are listed in the table below.

Valid hour cycle types

Hour cycle type Description
h12 Hour system using 1–12; corresponds to 'h' in patterns. The 12 hour clock, with midnight starting at 12:00 am.
h23 Hour system using 0–23; corresponds to 'H' in patterns. The 24 hour clock, with midnight starting at 0:00.
h11 Hour system using 0–11; corresponds to 'K' in patterns. The 12 hour clock, with midnight starting at 0:00 am.
h24 Hour system using 1–24; corresponds to 'k' in pattern. The 24 hour clock, with midnight starting at 24:00.

Examples

These examples will show you how to add hour cycle data to your Locale object.

Adding an hour cycle via the locale string

In the Unicode locale string spec, the hour cycle is a locale string "extension subtag". These subtags add additional data about the locale, and are added to locale identifiers by using the -u extension key. Thus, the hour cycle type can be added to the inital locale identifier string that is passed into the Locale constructor. To add the hour cycle type, first add the -u extension key to the string. Next, add the -hc extension key to indicate that you are adding an hour cycle. Finally, add the hour cycle type to the string.

let fr24hour = new Intl.Locale("fr-FR-u-hc-h23");
console.log(fr24hour.hourCycle); // Prints "h23"

Adding an hour cycle via the configuration object argument

The Intl.Locale constructor has an optional configuration object argument, which can contain any of several extension types, including hour cycle types. Set the hourCycle property of the configuration object to your desired hour cycle type, and then pass it into the constructor.

let us12hour = new Intl.Locale("en-US", {hourCycle: "h12"});
console.log(us12hour.hourCycle); // Prints "h12"

Specifications

Specification
ECMAScript Internationalization API (ECMA-402)

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile Server
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.js
hourCycle Chrome

Full support 74

Edge

Full support 79

Firefox

Full support 75

IE

No support No

Opera

Full support 62

Safari

Full support 14

WebView Android

Full support 74

Chrome Android

Full support 74

Firefox Android

No support No

Opera Android

Full support 53

Safari iOS

Full support 14

Samsung Internet Android

Full support 11.0

nodejs Full support 12.0.0

Notes'

Full support 12.0.0

Notes'

Notes' Before version 13.0.0, only the locale data for en-US is available by default. See the Locale() constructor for more details.

Legend

Full support  
Full support
No support  
No support
See implementation notes.'
See implementation notes.


See also