博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript国际化_JavaScript国际化
阅读量:2503 次
发布时间:2019-05-11

本文共 6913 字,大约阅读时间需要 23 分钟。

javascript国际化

Intl is a powerful object that exposes the JavaScript Internationalization API.

Intl是一个功能强大的对象,它公开了JavaScript国际化API

It exposes the following properties:

它公开了以下属性:

  • Intl.Collator: gives you access to language-sensitive string comparison

    Intl.Collator :使您可以访问语言敏感的字符串比较

  • Intl.DateTimeFormat: gives you access to language-sensitive date and time formatting

    Intl.DateTimeFormat :使您可以访问对语言敏感的日期和时间格式

  • Intl.NumberFormat: gives you access to language-sensitive number formatting

    Intl.NumberFormat :使您可以访问对语言敏感的数字格式

  • Intl.PluralRules: gives you access to language-sensitive plural formatting and plural language rules

    Intl.PluralRules :使您可以访问对语言敏感的复数格式和复数语言规则

  • Intl.RelativeTimeFormat: gives you access to language-sensitive relative time formatting

    Intl.RelativeTimeFormat :使您可以访问语言敏感的相对时间格式

It also provides one method: Intl.getCanonicalLocales().

它还提供了一种方法: Intl.getCanonicalLocales()

Intl.getCanonicalLocales() lets you check if a locale is valid, and returns the correct formatting for it. It can accept a string, or an array:

Intl.getCanonicalLocales()使您可以检查语言环境是否有效,并为其返回正确的格式。 它可以接受字符串或数组:

Intl.getCanonicalLocales('it-it') //[ 'it-IT' ]Intl.getCanonicalLocales(['en-us', 'en-gb']) //[ 'en-US', 'en-GB' ]

and throws an error if the locale is invalid

并在语言环境无效时引发错误

Intl.getCanonicalLocales('it_it') //RangeError: Invalid language tag: it_it

which you can catch with a try/catch block.

您可以使用try / catch块来捕获。

Different types can interface with the Intl API for their specific needs. In particular we can mention:

不同类型可以根据其特定需求与Intl API接口。 我们尤其可以提及:

  • String.prototype.localeCompare()

    String.prototype.localeCompare()

  • Number.prototype.toLocaleString()

    Number.prototype.toLocaleString()

  • Date.prototype.toLocaleString()

    Date.prototype.toLocaleString()

  • Date.prototype.toLocaleDateString()

    Date.prototype.toLocaleDateString()

  • Date.prototype.toLocaleTimeString()

    Date.prototype.toLocaleTimeString()

Let’s go and see how to work with the above Intl properties:

让我们来看一下如何使用以上Intl属性:

国际整理者 (Intl.Collator)

This property gives you access to language-sensitive string comparison

此属性使您可以访问语言敏感的字符串比较

You initialize a Collator object using new Intl.Collator(), passing it a locale, and you use its compare() method which returns a positive value if the first argument comes after the second one. A negative if it’s the reverse, and zero if it’s the same value:

您可以使用new Intl.Collator()初始化Collat​​or对象,并向其传递语言环境,并使用其compare()方法,如果第一个参数在第二个参数之后,则该方法返回正值。 如果为负数,则为负数;如果为相同值,则为零:

const collator = new Intl.Collator('it-IT')collator.compare('a', 'c') //a negative valuecollator.compare('c', 'b') //a positive value

We can use it to order arrays of characters, for example.

例如,我们可以使用它来排序字符数组。

国际日期时间格式 (Intl.DateTimeFormat)

This property gives you access to language-sensitive date and time formatting.

此属性使您可以访问对语言敏感的日期和时间格式。

You initialize a DateTimeFormat object using new Intl.DateTimeFormat(), passing it a locale, and then you pass it a date to format it as that locale prefers:

您使用new Intl.DateTimeFormat()初始化DateTimeFormat对象, new Intl.DateTimeFormat()传递一个语言环境,然后向其传递一个日期以按照该语言环境的要求对其进行格式化:

const date = new Date()let dateTimeFormatter = new Intl.DateTimeFormat('it-IT')dateTimeFormatter.format(date) //27/1/2019dateTimeFormatter = new Intl.DateTimeFormat('en-GB')dateTimeFormatter.format(date) //27/01/2019dateTimeFormatter = new Intl.DateTimeFormat('en-US')dateTimeFormatter.format(date) //1/27/2019

The formatToParts() method returns an array with all the date parts:

formatToParts()方法返回一个包含所有日期部分的数组:

const date = new Date()const dateTimeFormatter = new Intl.DateTimeFormat('en-US')dateTimeFormatter.formatToParts(date)/*[ { type: 'month', value: '1' },  { type: 'literal', value: '/' },  { type: 'day', value: '27' },  { type: 'literal', value: '/' },  { type: 'year', value: '2019' } ]*/

You can print the time as well. Check all the options you can use .

您也可以打印时间。 检查您可以使用的所有选项。

国际编号格式 (Intl.NumberFormat)

This property gives you access to language-sensitive number formatting. You can use it to format a number as a currency value.

此属性使您可以访问对语言敏感的数字格式。 您可以使用它来格式化数字作为货币值。

Say you have a number like 10, and it represents the price of something.

假设您有一个类似10的数字,它表示某物的价格。

You want to transform it to $10,00.

您想将其转换为$10,00

If the number has more than 3 digits however it should be displayed differently, for example, 1000 should be displayed as $1.000,00

如果数字多于3位,但是应该以不同的方式显示,例如,应将$1.000,00 1000显示为$1.000,00

This is in USD, however.

但是,这是美元。

Different countries have different conventions to display values.

不同的国家有不同的惯例来显示价值

JavaScript makes it very easy for us with the , a relatively recent browser API that provides a lot of internationalization features, like dates and time formatting.

JavaScript通过 (它是一种相对较新的浏览器API)对我们来说非常容易,该API提供了许多国际化功能,例如日期和时间格式,这是一个相对较新的浏览器API。

It is very well supported:

它得到很好的支持:

Browser support for the internationalization API
const formatter = new Intl.NumberFormat('en-US', {  style: 'currency',  currency: 'USD',  minimumFractionDigits: 2})formatter.format(1000) // "$1,000.00"formatter.format(10) // "$10.00"formatter.format(123233000) // "$123,233,000.00"

The minimumFractionDigits property sets the fraction part to be always at least 2 digits. You can check which other parameters you can use in .

minimumFractionDigits属性将小数部分始终设置为至少2位数。 您可以在检查可以使用哪些其他参数。

This example creates a number formatter for the Euro currency, for the Italian country:

本示例为意大利国家/地区创建欧元货币的数字格式化程序:

const formatter = new Intl.NumberFormat('it-IT', {  style: 'currency',  currency: 'EUR'})

国际规则 (Intl.PluralRules)

This property gives you access to language-sensitive plural formatting and plural language rules. I found the only one I could relate to practical usage: giving a suffix to ordered numbers: 0th, 1st, 2nd, 3rd, 4th, 5th..

此属性使您可以访问对语言敏感的复数格式和复数语言规则。 我找到是我可以与实际使用相关的唯一 :在有序数字后缀:0th,1st,2nd,3rd,4th,5th。

const pr = new Intl.PluralRules('en-US', {    type: 'ordinal'})pr.select(0) //otherpr.select(1) //onepr.select(2) //twopr.select(3) //fewpr.select(4) //otherpr.select(10) //otherpr.select(22) //two

Every time we got other, we translate that to th. If we have one, we use st. For two we use nd. few gets rd.

每当我们有时间other ,我们那意思就是th 。 如果我们有one ,我们使用st 。 对于two我们使用ndfew得到rd

We can use an object to create an associative array:

我们可以使用一个对象来创建一个关联数组:

const suffixes = {  'one': 'st',  'two': 'nd',  'few': 'rd',  'other': 'th'}

and we do a formatting function to reference the value in the object, and we return a string containing the original number, and its suffix:

然后我们执行格式化操作以引用对象中的值,然后返回包含原始数字及其后缀的字符串:

const format = (number) => `${number}${suffixes[pr.select(number)]}`

Now we can use it like this:

现在我们可以像这样使用它:

format(0) //0thformat(1) //1stformat(2) //2ndformat(3) //3rdformat(4) //4thformat(21) //21stformat(22) //22nd


Note that there are nice things coming soon to Intl, like and , which are at the time of writing only available in Chrome and Opera.

请注意,Intl即将推出一些不错的功能,例如和 ,它们在撰写本文时仅在Chrome和Opera中可用。

翻译自:

javascript国际化

转载地址:http://ulqgb.baihongyu.com/

你可能感兴趣的文章
docker-daemon.json各配置详解
查看>>
Docker(一)使用阿里云容器镜像服务
查看>>
Docker(三) 构建镜像
查看>>
FFmpeg 新旧版本编码 API 的区别
查看>>
RecyclerView 源码深入解析——绘制流程、缓存机制、动画等
查看>>
Android 面试题整理总结(一)Java 基础
查看>>
Android 面试题整理总结(二)Java 集合
查看>>
学习笔记_vnpy实战培训day02
查看>>
学习笔记_vnpy实战培训day03
查看>>
VNPY- VnTrader基本使用
查看>>
VNPY - CTA策略模块策略开发
查看>>
VNPY - 事件引擎
查看>>
MongoDB基本语法和操作入门
查看>>
学习笔记_vnpy实战培训day04_作业
查看>>
OCO订单(委托)
查看>>
学习笔记_vnpy实战培训day06
查看>>
回测引擎代码分析流程图
查看>>
Excel 如何制作时间轴
查看>>
matplotlib绘图跳过时间段的处理方案
查看>>
vnpy学习_04回测评价指标的缺陷
查看>>