随着全球化的发展,处理国际化信息成为了前端开发越来越重要的一部分。在 ES11 中,新增加了 Intl.DisplayNames
对象,可以方便地处理多语言标识,其使用方式非常灵活。
介绍
Intl.DisplayNames
对象为开发者提供了用于在不同语言环境下格式化区域设置信息的方式。通过该对象,我们能够方便地将特定区域的地理或文化信息本地化,支持的信息包括语言、脚本、国家/地区和货币等等。
Intl.DisplayNames
对象的 API 如下:
new Intl.DisplayNames(locales, options)
其中,locales
参数是一个字符串数组,用于指定要显示的语言集,可以是单个字符串或多个字符串;options
参数是一个配置对象,可选的配置项包括:
type
:标识符的类型,只能选择language
、script
、region
或currency
中的一个,分别表示语言、脚本、国家/地区和货币;style
:标识符的样式,只能选择narrow
、short
或long
中的一个;fallback
:指定当传入的语言或样式不支持时要使用的语言。
示例
下面是一个简单的示例,展示了如何使用 Intl.DisplayNames
对象将语言信息本地化:
const langDisplayNames = new Intl.DisplayNames(["zh", "en"], { type: "language" }); console.log(langDisplayNames.of("zh")); console.log(langDisplayNames.of("en")); console.log(langDisplayNames.of("ja"));
运行结果如下:
中文 English ja
在上面的示例中,我们定义了一个 Intl.DisplayNames
对象,指定了要显示的语言集为中文和英文,并使用 of
方法获取对应语言标识的本地化名称。
除了语言名称,我们还可以通过 Intl.DisplayNames
对象获取其他类型的标识符名称。例如,以下示例展示如何获取货币名称:
const currencyDisplayNames = new Intl.DisplayNames(["zh"], { type: "currency", style: "narrow" }); console.log(currencyDisplayNames.of("CNY")); console.log(currencyDisplayNames.of("USD"));
运行结果如下:
¥ $US
不同类型的标识符以及不同样式的标识符名称均可通过 type
和 style
参数进行配置。
总结
Intl.DisplayNames
对象的出现为我们提供了一种更为灵活和便捷的区域设置本地化方式。在处理国际化信息时,我们可以通过 Intl.DisplayNames
对象轻松获取不同语言、脚本、国家/地区和货币等信息的本地化名称。
该对象使用简单,并具有良好的可定制性,初学者只需要掌握基本的 API 就能进行使用。对于熟练的开发者,还可以使用更加高级的配置,实现更亲民、智能化的国际化体验。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64549d53968c7c53b0870a95