随着全球化的不断发展，国际化已经成为了前端开发中必不可少的一部分。ECMAScript 2021（ES12）中新增了一些新的国际化 API，使得前端开发者可以更加便捷地处理不同语言和地区的数据。
1. Intl.DisplayNames
Intl.DisplayNames API 可以将语言、地区、货币等标识符转换为对应的名称。例如，将 en-US 转换为 English (United States)。
1.1 基本用法
----- ------------ - --- ------------------------- - ----- -------- --- ----------------------------------- -- ------ ------
在上述代码中，我们创建了一个 Intl.DisplayNames 实例，并指定了要转换的类型为 region，表示要将地区标识符转换为地区名称。然后，我们调用 of() 方法来将 US 转换为 United States。
1.2 参数说明
Intl.DisplayNames 构造函数接受两个参数：
locales：一个字符串数组，表示要使用的语言环境。如果该参数为undefined或空数组，则使用默认语言环境。options：一个对象，表示选项。可选的选项包括：type：一个字符串，表示要转换的标识符类型。可选的值包括language、region、script、currency和variant。默认值为language。style：一个字符串，表示要使用的名称风格。可选的值包括narrow、short和long。默认值为long。
1.3 示例代码
----- ------------ - --- ------------------------- - ----- --------- ------ ------ --- ----------------------------------- -- ------ ------ ----- ------------- - --- ------------------------- - ----- ----------- ------ ------- --- ------------------------------------ -- -
2. Intl.ListFormat
Intl.ListFormat API 可以将数组转换为字符串，并指定分隔符和最后一个分隔符的风格。例如，将 ['apple', 'banana', 'orange'] 转换为 apple, banana, and orange。
2.1 基本用法
----- ---- - --------- --------- ---------- ----- ---------- - --- --------------------- - ------ ------- ----- ------------- --- ------------------------------------- -- ------ ------- --- ------
在上述代码中，我们创建了一个 Intl.ListFormat 实例，并指定了要使用的语言环境为 en，风格为 long，类型为 conjunction，表示要使用连词将数组元素连接起来。然后，我们调用 format() 方法将数组转换为字符串。
2.2 参数说明
Intl.ListFormat 构造函数接受两个参数：
locale：一个字符串，表示要使用的语言环境。如果该参数为undefined或空字符串，则使用默认语言环境。options：一个对象，表示选项。可选的选项包括：type：一个字符串，表示要使用的类型。可选的值包括conjunction、disjunction和unit。默认值为conjunction。style：一个字符串，表示要使用的名称风格。可选的值包括narrow、short和long。默认值为long。
2.3 示例代码
----- ---- - --------- --------- ---------- ----- ---------- - --- --------------------- - ------ -------- ----- ------------- --- ------------------------------------- -- ------ ------- -- ------ ----- ----------- - --- --------------------- - ------ --------- ----- ------ --- ------------------------------------ ---- ------- -- -----
3. Intl.RelativeTimeFormat
Intl.RelativeTimeFormat API 可以将时间间隔转换为相对时间，例如 1 day ago 或 in 2 weeks。
3.1 基本用法
----- --- - --- ----------------------------- - ------ ------ --- -------------------------- -------- -- - --- --- ------------------------- --------- -- -- - -----
在上述代码中，我们创建了一个 Intl.RelativeTimeFormat 实例，并指定了要使用的语言环境为 en，风格为 long。然后，我们调用 format() 方法将时间间隔转换为相对时间。
3.2 参数说明
Intl.RelativeTimeFormat 构造函数接受两个参数：
locale：一个字符串，表示要使用的语言环境。如果该参数为undefined或空字符串，则使用默认语言环境。options：一个对象，表示选项。可选的选项包括：style：一个字符串，表示要使用的名称风格。可选的值包括narrow、short和long。默认值为long。
3.3 示例代码
----- --- - --- ----------------------------- - ------ ------- --- -------------------------- -------- -- - --- --- ------------------------- --------- -- -- - --- ----- ---- - --- ----------------------------- - ------ ------ --- --------------------------- -------- -- - -- -------------------------- ---------- -- - ---
4. 总结
以上就是 ECMAScript 2021（ES12）中新增的三个国际化 API：Intl.DisplayNames、Intl.ListFormat 和 Intl.RelativeTimeFormat。它们可以让我们更加便捷地处理不同语言和地区的数据，提高前端开发效率。在实际开发中，我们可以根据具体需求选择合适的 API，并结合示例代码进行学习和实践。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65f100822b3ccec22f9d47fb