Intl.DisplayNames.prototype.of()

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 of() method of Intl.DisplayNames instances receives a code and returns a string based on the locale and options provided when instantiating this Intl.DisplayNames object.

Try it

const regionNamesInEnglish = new Intl.DisplayNames(["en"], { type: "region" });
const regionNamesInTraditionalChinese = new Intl.DisplayNames(["zh-Hant"], {
  type: "region",
});

console.log(regionNamesInEnglish.of("US"));
// Expected output: "United States"

console.log(regionNamesInTraditionalChinese.of("US"));
// Expected output: "美國"

Syntax

js
of(code)

Parameters

code

The code to provide depends on the type:

Return value

A language-specific formatted string, or undefined if there's no data for the input and fallback is "none".

Note: fallback is only used if code is structurally valid. See using fallback.

Exceptions

RangeError

Thrown if code is not structurally valid for the given type.

Examples

Using the of method

js
const regionNames = new Intl.DisplayNames("en", { type: "region" });
regionNames.of("419"); // "Latin America"

const languageNames = new Intl.DisplayNames("en", { type: "language" });
languageNames.of("fr"); // "French"

const currencyNames = new Intl.DisplayNames("en", { type: "currency" });
currencyNames.of("EUR"); // "Euro"

const languageNamesStandard = new Intl.DisplayNames("fr", {
  type: "language",
  languageDisplay: "standard",
});
languageNamesStandard.of("fr-CA"); // "français (Canada)"

const languageNamesDialect = new Intl.DisplayNames("fr", {
  type: "language",
  languageDisplay: "dialect",
});
languageNamesDialect.of("fr-CA"); // "français canadien"

Using fallback

When the Intl.DisplayNames is constructed with fallback: "code", the of() method will return the code if the input looks structurally valid but there's no data for the input. If fallback is "none", undefined is returned.

js
console.log(
  new Intl.DisplayNames("en", { type: "region", fallback: "code" }).of("ZL"),
); // "ZL"

console.log(
  new Intl.DisplayNames("en", { type: "region", fallback: "none" }).of("ZL"),
); // undefined

However, this only applies if the code is structurally valid. For example, if type is "region" but code does not follow the unicode_region_subtag grammar (2 alphabetic characters or 3 numeric characters), a RangeError is directly thrown instead of using the fallback.

js
console.log(
  new Intl.DisplayNames("en", { type: "region", fallback: "code" }).of("ZLC"),
); // throws RangeError: invalid value "ZLC" for option region

Specifications

Specification
ECMAScript® 2027 Internationalization API Specification
# sec-Intl.DisplayNames.prototype.of

Browser compatibility

desktop mobile server
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Bun
Deno
Node.js
of
Chrome – Full support
Chrome 81 (Release date: 2020-04-07)
footnote Full support
Edge – Full support
Edge 81 (Release date: 2020-04-13)
footnote Full support
Firefox – Full support
Firefox 86 (Release date: 2021-02-23)
footnote Full support
Opera – Full support
Opera 68 (Release date: 2020-04-22)
footnote Full support
Safari – Full support
Safari 14.1 (Release date: 2021-04-26)
footnote Full support
Chrome Android – Full support
Chrome Android 81 (Release date: 2020-04-07)
footnote Full support
Firefox for Android – Full support
Firefox for Android 86 (Release date: 2021-02-23)
footnote Full support
Opera Android – Full support
Opera Android 58 (Release date: 2020-05-13)
footnote Full support
Safari on iOS – Full support
Safari on iOS 14.5 (Release date: 2021-04-26)
footnote Full support
Samsung Internet – Full support
Samsung Internet 13 (Release date: 2020-12-02)
footnote Full support
WebView Android – Full support
WebView Android 81 (Release date: 2020-04-07)
footnote Full support
WebView on iOS – Full support
WebView on iOS 14.5 (Release date: 2021-04-26)
footnote Full support
Bun – Full support
Bun 1 (Release date: 2023-09-08)
footnote Full support
Deno – Full support
Deno 1.8 (Release date: 2021-03-02)
footnote Full support
Node.js – Full support
Node.js 14 (Release date: 2020-04-21)
footnote Full support

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

See also