在前端开发中，数字格式化是一个经常需要处理的问题。比如在页面中展示货币、时间、数量等数据时，经常需要对数字进行格式化，以符合不同的国家、地区的不同的显示方式和习惯。
在 ECMAScript 2018 中，新增了一个 Intl.NumberFormat API，用于实现数字的格式化。
API 介绍
Intl.NumberFormat 可以通过以下方式创建实例：
----- -- - --- ---------------------------- ----------
其中 locales 是一个字符串或者字符串数组，表示需要格式化的数字的语言环境。如果省略 locales，则默认使用当前环境的语言环境。options 是一个对象，包含如下属性：
- style: 一个字符串，表示数字的格式化风格，可以是 decimal（十进制数）、currency（货币数值）或者 percent（百分比数值）。
- currency: 一个字符串，表示货币的代码。
- currencyDisplay: 一个字符串，表示在格式货币时货币符号的显示方式，可以是 symbol（货币符号）、code（货币代码）或者 name（货币名称）。
- minimumIntegerDigits: 一个数字，表示整数部分的最小位数。
- minimumFractionDigits: 一个数字，表示小数部分的最小位数。
- maximumFractionDigits: 一个数字，表示小数部分的最大位数。
通过实例化 Intl.NumberFormat，我们可以得到一个数字格式化器，它提供了 format 和 formatToParts 两个方法。
- format：将数字格式化为字符串。
- formatToParts：将数字格式化为一个数组，数组中的每个 item 是一个描述数字的对象，包含以下属性：
- type：表示该部分的类型（"integer" 代表整数部分，"decimal" 代表小数部分，"group" 代表组分隔符，"percentSign" 代表百分比符号，"currency" 代表货币符号）。
- value：表示该部分的值。
示例
我们来看一个具体的例子。
假设我们需要将网站上的订单总金额转换成人民币格式，要求：
- 冠以 RMB 前缀；
- 保留两位小数；
- 整数部分每 3 位以逗号分隔。
以下是使用 Intl.NumberFormat 的代码：
----- -- - --- -------------------------- - ------ ----------- --------- ------ ---------------- ------- ---------------------- -- ---------------------- - -- ----- ---------- - ---------- ---------------------------------------------
其中：
- zh-CN 表示中国大陆的语言环境；
- currency 表示货币风格；
- CNY 表示货币代码；
- name 表示以货币名称方式显示。
运行以上代码，输出的结果如下：
-----------------------
如果我们希望得到一个更加精细的结果，同时还需要将格式化结果拆分为多个部分，可以这样来实现：
----- -- - --- -------------------------- -
------ -----------
--------- ------
---------------- -------
---------------------- --
---------------------- -
--
----- ---------- - ----------
----- ----- - ----------------------------
--- ------ - --
--- ---- - - -- - - ------------- ---- -
------ --------------- -
---- ----------
------ -- ------------------------------------------ ------
-----
---- ----------
------ -- --------------
-----
---- -----------
------ - ---- ---------------------------
-----
--------
------ -- --------------
-
-
------------------------------运行以上代码，输出的结果如下：
-----------------------
总结
Intl.NumberFormat 提供了一种方便而且可定制的方式来实现数字的格式化，在全球化的 Web 应用中得到了广泛的应用。我们可以通过掌握该 API 的使用方法，实现复杂的数字格式化需求。
以下是一些建议：
- 在代码中使用本地语言环境；
- 根据实际需求使用不同的格式化选项；
- 在需要拆分数字时使用 formatToParts。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64d1c522b5eee0b52591da59