Intl.DisplayNames() constructor
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021.
The Intl.DisplayNames()
constructor creates Intl.DisplayNames
objects.
Try it
Syntax
Parameters
locales
-
A string with a BCP 47 language tag or an
Intl.Locale
instance, or an array of such locale identifiers. The runtime's default locale is used whenundefined
is passed or when none of the specified locale identifiers is supported. For the general form and interpretation of thelocales
argument, see the parameter description on theIntl
main page. options
-
An object containing the following properties, in the order they are retrieved:
localeMatcher
Optional-
The locale matching algorithm to use. Possible values are
"lookup"
and"best fit"
; the default is"best fit"
. For information about this option, see Locale identification and negotiation. style
Optional-
The formatting style to use. Possible values are
"narrow"
,"short"
, and"long"
; the default is"long"
. type
-
The type of display names to return from
of()
. Possible values are"language"
,"region"
,"script"
,"currency"
,"calendar"
, and"dateTimeField"
. fallback
Optional-
What to return from
of()
if the input is structurally valid but there's no matching display name. Possible values are: languageDisplay
Optional-
How language names should be displayed. Only usable along with
type: "language"
. Possible values are:"dialect"
(default)-
Display special regional dialects using their own name. E.g.
"nl-BE"
will be displayed as"Flemish"
. "standard"
-
Display all languages using standard format. E.g.
"nl-BE"
will be displayed as"Dutch (Belgium)"
.
Exceptions
TypeError
-
Thrown if
options.type
is not provided. RangeError
-
Thrown if
locales
oroptions
contain invalid values.
Examples
Basic usage
In basic use without specifying a locale, a formatted string in the default locale and with default options is returned.
console.log(new Intl.DisplayNames([], { type: "language" }).of("US"));
// 'us'
Using type dateTimeField
Example using dateTimeField
as a type option, will return the localized date time names strings.
const dn = new Intl.DisplayNames("pt", { type: "dateTimeField" });
console.log(dn.of("era")); // 'era'
console.log(dn.of("year")); // 'ano'
console.log(dn.of("month")); // 'mês'
console.log(dn.of("quarter")); // 'trimestre'
console.log(dn.of("weekOfYear")); // 'semana'
console.log(dn.of("weekday")); // 'dia da semana'
console.log(dn.of("dayPeriod")); // 'AM/PM'
console.log(dn.of("day")); // 'dia'
console.log(dn.of("hour")); // 'hora'
console.log(dn.of("minute")); // 'minuto'
console.log(dn.of("second")); // 'segundo'
Using type calendar
Example using calendar
as a type option, will return the localized calendar names strings.
const dn = new Intl.DisplayNames("en", { type: "calendar" });
console.log(dn.of("roc")); // 'Minguo Calendar'
console.log(dn.of("gregory")); // 'Gregorian Calendar'
console.log(dn.of("chinese")); // 'Chinese Calendar'
Using type language
with languageDisplay
Example using language
as a type with languageDisplay
options.
// Using `dialect` option
const dnDialect = new Intl.DisplayNames("en", {
type: "language",
languageDisplay: "dialect",
});
console.log(dnDialect.of("en-GB")); // 'British English'
// Using `standard` option
const dnStd = new Intl.DisplayNames("en", {
type: "language",
languageDisplay: "standard",
});
console.log(dnStd.of("en-GB")); // 'English (United Kingdom)'
Specifications
Specification |
---|
ECMAScript Internationalization API Specification # sec-intl-displaynames-constructor |
Browser compatibility
BCD tables only load in the browser