ECMAScript 2020 深入探究：数字格式化 Intl.NumberFormat-JavaScript中文网-JavaScript教程资源分享门户

ECMAScript 2020 深入探究：数字格式化 Intl.NumberFormat

在前端开发中，数字格式化是常见且重要的操作。ECMAScript 2020 引入了 Intl.NumberFormat，提供了更加灵活、强大的数字格式化方案。本文将深入探究 Intl.NumberFormat 的使用方法和特性，为大家带来学习和指导意义。

一、Intl.NumberFormat 概述

Intl.NumberFormat 是 ECMAScript 2020 新增的国际化 API，用于对数字进行格式化和本地化。它可以根据不同的语言环境和地区，自动将数字转换成对应的格式，并支持自定义格式化选项。

使用 Intl.NumberFormat，可以轻松地实现以下功能：

数字的千分位分隔符和小数点分隔符的设置；
数字的精度控制；
货币符号和货币格式的设置；
根据不同的语言环境和地区，自动将数字转换成对应的格式。

二、Intl.NumberFormat 的基本用法

Intl.NumberFormat 的使用非常简单，只需要创建一个 Intl.NumberFormat 的实例，然后调用 format 方法即可。下面是一个简单的示例代码：

const number = 12345.6789;
const formatter = new Intl.NumberFormat('en-US');
console.log(formatter.format(number));

输出结果为：

12,345.679

上述代码中，我们首先声明了一个数字变量 number，然后创建了一个 Intl.NumberFormat 实例 formatter，指定了语言环境为 en-US（美国英语）。最后调用 format 方法，将数字格式化成了千分位分隔符和小数点分隔符的形式。

三、Intl.NumberFormat 的参数选项

Intl.NumberFormat 支持多种参数选项，可以根据需要进行自定义。下面是一些常用的参数选项：

style：指定数字格式化的类型，包括 decimal（十进制）、percent（百分比）和 currency（货币）三种，默认为 decimal；
currency：当 style 为 currency 时，指定货币类型，默认为 USD（美元）；
minimumIntegerDigits：指定整数部分的最小位数；
minimumFractionDigits：指定小数部分的最小位数；
maximumFractionDigits：指定小数部分的最大位数；
minimumSignificantDigits：指定有效数字的最小位数；
maximumSignificantDigits：指定有效数字的最大位数；
useGrouping：指定是否使用千分位分隔符，默认为 true。

下面是一个使用参数选项的示例代码：

const number = 12345.6789;
const formatter = new Intl.NumberFormat('zh-CN', {
  style: 'currency',
  currency: 'CNY',
  minimumFractionDigits: 2,
  maximumFractionDigits: 2,
});
console.log(formatter.format(number));

输出结果为：

￥12,345.68

上述代码中，我们指定了语言环境为 zh-CN（中文简体），格式化类型为 currency（货币），货币类型为 CNY（人民币），小数部分的最小位数为 2，最大位数也为 2。最后调用 format 方法，将数字格式化成了人民币的形式。

四、Intl.NumberFormat 的高级用法

除了基本的数字格式化功能，Intl.NumberFormat 还支持更加高级的用法，包括自定义货币符号、自定义千分位分隔符和小数点分隔符等。

自定义货币符号

可以使用 currencyDisplay 选项来自定义货币符号的显示方式。该选项支持三种值：

"symbol"：显示货币符号；
"code"：显示货币代码；
"name"：显示货币名称。

下面是一个示例代码：

const number = 12345.6789;
const formatter = new Intl.NumberFormat('en-US', {
  style: 'currency',
  currency: 'USD',
  currencyDisplay: 'code',
});
console.log(formatter.format(number));

输出结果为：

USD12,345.68

上述代码中，我们指定了货币显示方式为 code，即显示货币代码。

自定义千分位分隔符和小数点分隔符

可以使用 groupingSeparator 和 decimalSeparator 选项来自定义千分位分隔符和小数点分隔符。下面是一个示例代码：

const number = 12345.6789;
const formatter = new Intl.NumberFormat('en-US', {
  useGrouping: true,
  groupingSeparator: '.',
  decimalSeparator: ',',
});
console.log(formatter.format(number));

输出结果为：

12.345,679

上述代码中，我们指定了千分位分隔符为 .，小数点分隔符为 ,。

五、总结

Intl.NumberFormat 是 ECMAScript 2020 新增的国际化 API，可用于对数字进行格式化和本地化。它支持多种参数选项，可以根据需要进行自定义。除了基本的数字格式化功能外，还支持自定义货币符号、自定义千分位分隔符和小数点分隔符等高级用法。使用 Intl.NumberFormat，可以轻松地实现数字格式化和本地化的需求，提高应用程序的用户体验。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65766ee2d2f5e1655dfb0962