Intl.NumberFormat.prototype.formatToParts()

¥Syntax

formatToParts()
formatToParts(number)

¥Parameters

number Optional

要格式化的 Number 或 BigInt。

¥Return value

包含部分格式化数字的 Array 个对象。

¥An Array of objects containing the formatted number in parts.

¥Description

formatToParts() 方法对于数字字符串的自定义格式很有用。它返回 Array 个对象，其中包含特定于区域设置的标记，可以从中构建自定义字符串，同时保留特定于区域设置的部分。formatToParts() 方法返回的结构如下所示：

¥The formatToParts() method is useful for custom formatting of number strings. It returns an Array of objects containing the locale-specific tokens from which it possible to build custom strings while preserving the locale-specific parts. The structure the formatToParts() method returns, looks like this:

[
  { type: "integer", value: "3" },
  { type: "group", value: "." },
  { type: "integer", value: "500" },
];

可能的类型如下：

¥Possible types are the following:

compact

"long" 或 "short" 形式的指数，具体取决于当 notation 设置为 compact 时如何指定 compactDisplay（默认为 short）。

currency

货币字符串，例如符号 "$" 和 "€" 或名称 "美元"、"欧元"，具体取决于 currencyDisplay 的指定方式。

decimal

小数点分隔符字符串 (".")。

exponentInteger

当 notation 设置为 scientific 或 engineering 时，指数整数值。

exponentMinusSign

指数减号字符串 ("*")。

exponentSeparator

当 notation 设置为 scientific 或 engineering 时，指数分隔符。

fraction

分数。

group

组分隔符字符串 (",")。

infinity

Infinity 字符串 ("∞")。

integer

整数。

literal

格式化数字中的任何文字字符串或空格。

minusSign

减号字符串 ("*")。

nan

NaN 字符串 ("NaN")。

plusSign

加号字符串 ("*")。

percentSign

百分号字符串 ("%")。

unit

单位字符串，例如 "l" 或 "litres"，具体取决于 unitDisplay 的指定方式。

unknown

unknown 类型结果的字符串。

¥Examples

¥Comparing format and formatToParts

NumberFormat 输出无法直接操作的本地化、不透明字符串：

¥NumberFormat outputs localized, opaque strings that cannot be manipulated directly:

const number = 3500;

const formatter = new Intl.NumberFormat("de-DE", {
  style: "currency",
  currency: "EUR",
});

formatter.format(number);
// "3.500,00 €"

然而，在许多用户界面中都希望自定义该字符串的格式。formatToParts 方法通过为你提供部分字符串来启用 NumberFormat 格式化程序生成的字符串的区域设置感知格式：

¥However, in many User Interfaces there is a desire to customize the formatting of this string. The formatToParts method enables locale-aware formatting of strings produced by NumberFormat formatters by providing you the string in parts:

formatter.formatToParts(number);

// return value:
[
  { type: "integer", value: "3" },
  { type: "group", value: "." },
  { type: "integer", value: "500" },
  { type: "decimal", value: "," },
  { type: "fraction", value: "00" },
  { type: "literal", value: " " },
  { type: "currency", value: "€" },
];

现在，这些信息可以单独使用，并且可以以自定义方式再次格式化和连接。例如，使用 Array.prototype.map()、箭头函数、switch 语句、模板文字 和 Array.prototype.reduce()。

¥Now the information is available separately and it can be formatted and concatenated again in a customized way. For example by using Array.prototype.map(), arrow functions, a switch statement, template literals, and Array.prototype.reduce().

const numberString = formatter
  .formatToParts(number)
  .map(({ type, value }) => {
    switch (type) {
      case "currency":
        return `<strong>${value}</strong>`;
      default:
        return value;
    }
  })
  .reduce((string, part) => string + part);

使用 formatToParts() 方法时，这将使货币变为粗体。

¥This will make the currency bold, when using the formatToParts() method.

console.log(numberString);
// "3.500,00 <strong>€</strong>"

¥See also

• Intl.NumberFormat
• Intl.NumberFormat.prototype.format()
• Intl.DateTimeFormat.prototype.formatToParts()