在ES12中，新增了一个有用的API——Intl.DisplayNames，它可以帮助我们将各种名称（如语言、国家、货币）转换成用户所理解的本地化标识，使得我们可以在前端页面上更好地支持国际化。本文将详细介绍Intl.DisplayNames的用法和作用，并提供一些实际示例供大家参考。
什么是Intl.DisplayNames
Intl.DisplayNames是安全国际化API（Internationalization API）的一部分，旨在提供一个将各种名称转换成用户所理解的本地化标识的工具。它支持的名称类型包括：语言（language）、脚本（script）、区域（region）、货币（currency）、类型（type）和显式地指定本地化（locale）等。
在使用Intl.DisplayNames时，我们可以指定要展示的语言（locale）和风格（style），然后将需要转换的名称传递给实例的属性或方法中。代码示例如下：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'currency' });
console.log(displayNames.of('USD')); // 输出 "美元"上面的代码创建了一个用于大陆地区（zh-CN）货币（currency）名称的实例，并将国际ISO货币代码（'USD'）传递给了该实例的of方法。该方法将返回"美元"，这是用户所理解的本地化标识。
Intl.DisplayNames的风格
在使用Intl.DisplayNames时，我们可以指定一种显示风格，以便将名称本地化为用户理解的格式。目前，Intl.DisplayNames支持3种不同的风格：
- "narrow"：适用于较小的UI控件，例如tab标签。
- "short"：适用于较小的UI控件，例如标签或下拉列表。
- "long"：适用于可扩展的UI控件，例如面板或模态框。
在创建Intl.DisplayNames实例时，我们可以传递一个配置对象，其中可以指定风格（style），例如：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'language', style: 'long' });Intl.DisplayNames的属性和方法
Intl.DisplayNames提供了多种属性和方法，以满足不同的本地化需求。下面是部分常用属性和方法的详细说明。
of
of方法是最基本、也是最常用的一个方法，由它负责把不同于所支持范围字面的字符串转码，比如将货币代码"USD"转换为"美元"。
参数：
value传入需要转换的字符串
示例代码：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'currency' });
console.log(displayNames.of("USD")); // 输出“美元”resolvedOptions
resolvedOptions方法返回包含实例出属性以及参数配置的选项对象（option object）。
示例代码：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'currency' });
console.log(displayNames.resolvedOptions()); // 输出 {locale: "zh-CN", style: "narrow", type: "currency"}of
of方法是最基本、也是最常用的一个方法，由它负责把不同于所支持范围字面的字符串转码，比如将货币代码"USD"转换为"美元"。
参数：
value传入需要转换的字符串
示例代码：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'currency' });
console.log(displayNames.of("USD")); // 输出“美元”of
of方法是最基本、也是最常用的一个方法，由它负责把不同于所支持范围字面的字符串转码，比如将货币代码"USD"转换为"美元"。
参数：
value传入需要转换的字符串
示例代码：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'currency' });
console.log(displayNames.of("USD")); // 输出“美元”of
of方法是最基本、也是最常用的一个方法，由它负责把不同于所支持范围字面的字符串转码，比如将货币代码"USD"转换为"美元"。
参数：
value传入需要转换的字符串
示例代码：
const displayNames = new Intl.DisplayNames(['zh-CN'], { type: 'currency' });
console.log(displayNames.of("USD")); // 输出“美元”总结
通过使用Intl.DisplayNames，我们可以轻松地将各种名称转换成用户所理解的本地化标识，使得我们的应用程序能够更好地支持国际化。本文介绍了Intl.DisplayNames的基本用法和常用属性和方法，并给出了实际示例，希望有助于大家在实际项目中应用该API。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645cbdac968c7c53b0f301ad