hi1718 【第1718期】前端国际化利器 - Intl

前言

你目前的产品国际化计划是什么？今天的早读文章由@梁天培_Tim翻译授权分享。

@蒂姆·梁(Tim Liang)目前是Shopee的一名高级前端工程师，他曾在JD.COM保险杠实验室工作，该实验室是芋头块手册的编纂者之一

Intl是一个全局对象，它的主要目的是显示国际信息，它可以将字符串、数字、日期和时间转换成指定地区的格式。

国际化是应用程序无需编码就能适应各种语言和地区的一种方式。

Java开发人员不需要向代码包中添加几千字节的翻译文件。Intl有各种以locale为参数的构造函数和方法，可以根据你的需要格式化数据。以下是Intl的构成:

全局变量Intl

排序器、日期时间格式、列表格式、数字格式、复数规则和相对时间格式是在空之间命名的Intl中的构造函数。他们接受两个参数——地区和选项。区域设置必须是符合BCP 47语言标记规范的字符串或数组。如果您有兴趣了解更多关于BCP 47语言标签的信息，请参考以下摘自《市场营销网络:

BCP 47语言标签用于定义一种语言，其中包含该语言的主要信息。一般情况下，依次包括语言代码、脚本代码、国家代码，用连字符隔开。虽然这些标签不区分大小写，但建议以大写形式编写标题大小写的脚本代码，以小写形式编写国家和地区代码，其他内容。

区域设置参数的默认值是运行时区域设置。语言环境一般写成-en(英语)、hi(印地语)、ta-in(泰米尔语-印度)。Options参数是可选的，其结构随不同的构造函数而变化，主要用于提供格式化的自定义参数。

在本文中，我们将介绍一些在命名空之间的Intl中添加的新API。这些新的API已经在Google I/O '19上发布。让我们仔细看看这些API。

国际号码。RelativeTimeFormat

RelativeTimeFormat构造函数用于将时间戳转换成人性化的短语。它将一个不可读的日期对象转换为其相对的当前时间字符串。我们来看看下面的栗子:

国际号码。相对时间格式将时间转换成英语短语

在上面的栗子中，Intl的第一个参数。RelativeTimeFormat构造函数为en。配置项目选项中的数字可以是“始终”或“自动”，其中“始终”不会将数字格式化为短语，例如，rtf.format(-1，“月”)将被格式化为1个月前的格式。

如果您想将它们格式化为泰语，可以传递如下图所示的参数:

国际号码。带有ta-in区域设置的RelativeTimeFormat构造函数

像昨天、今天、明天这样的短语可以给用户提供更好的可读性！相关功能可以在Chrome 71和FireFox 65或更高版本中体验。

国际号码。列表格式

ListFormat构造函数用于将字符串连接成有意义的短语。

国际号码。列表格式用默认配置格式化为英文

format方法可以很好地连接字符数组中的字符串。如果我们不使用列表格式应用编程接口，我们必须编写函数将、、和插入适当的位置。

我们可以通过更改选项中的配置项来自定义格式化的内容:

国际号码。列表格式是用英语格式化的，带有析取参数

将类型设置为析取使用或来连接字符串。以下是选项某些属性的可选值:

类型:可选值有连接、析取、单位，其中连接为默认值，不需要连接词时使用单位类型，如下图所示:

国际号码。列表格式是用单位参数用英语格式化的

样式:可选值为长和短(或窄)

在Chrome 72及以上可以体验到ListFormat API。

国际号码。NumberFormat

与其他高级语言不同，Java为变量的数据类型提供了灵活性。Int、float、string或object都用var声明(let和const用于块级范围)。

但是怎么才能确定一个数有多大呢？

123456789123456789 * 11 // Prints 1358024680358024700

上述运算结果的单位不应为0！似乎我们需要为大数做些额外的事情。好消息是，我们已经有了BigInt来处理大量数据。让我们用BigInt再试一次:

123456789123456789n * 11n // Prints 1358024680358024679n

现在看起来正常多了！

大数字可读性普遍较差。在这种情况下，我们可能需要使用国际号码。NumberFormat API！它通过添加特定于地区的数字分隔符来格式化数字。让我们看看它的效果:

国际号码。NumberFormat构造函数

数字格式将根据您的地区设置而有所不同。设置为en时使用逗号分隔符，设置为fr时使用空。

我们可以通过更改选项对象中的配置项来自定义格式化的内容。选项中某些参数的可选值如下:样式:可选值为十进制、货币和百分比，默认值为十进制

货币:用于指定货币样式。例如:美元，印度卢比

当前显示:可选值为符号和代码，默认值为符号

您可以单击此处查看所有可配置的项目。

国际号码。数字格式现在在Chrome、FireFox和Safari中可用。

列表中还有一个更刺激的API:intl。日期时间格式

国际号码。日期时间格式

国际号码。日期时间格式应用编程接口用于将日期和时间格式化为指定的语言。此应用编程接口上的新方法格式化范围可以如下使用:

const df = new Intl.DateTimeFormat('en', {year: 'numeric',month: 'short',day: 'numeric'})const startDate = new Date('01-06-2019')const endDate = new Date('10-06-2019')df.formatRange(startDate, endDate) // Prints Jun 1-10 2019

注意:formatRange函数将显示同一个月的日期。

使用此API后，您可以从代码中删除仅用于格式化日期范围的方法！

选项中有许多配置项，如时区、纪元、年、月、日、小时、分钟、秒等。

标签

本文介绍了一些新的API Intl内容:

Intl.RelativeTimeFormat API可用于为时间戳生成相对于当前时间的人性化短语。Intl.ListFormat API可用于使用 conjunction，disjunction和unit 参数把数组元素连接成短语。Intl.NumberFormat可用于使用将大数格式化为指定的语言格式。Intl.DateTimeFormat API上的 formatRange 方法可用于生成时间范围的字符串。

关于本文译者:@梁天培_蒂姆翻译:https://juejin.im/post/5d58bf496fb9a06ace524da8作者:@安基塔·马桑原文:https://blog.bitsrc.io/new-intl-apis-in-java-c50dc89d2cf3

Ta已经分享了

【1658号】Chrome专家调试法——介绍Chrome开发者工具的最佳用法