Intl.NumberFormat.prototype.formatToParts()

试一试

const amount = 654321.987;
const options = { style: "currency", currency: "USD" };
const numberFormat = new Intl.NumberFormat("en-US", options);

const parts = numberFormat.formatToParts(amount);
const partValues = parts.map((p) => p.value);

console.log(partValues);
// Expected output: "["$", "654", ",", "321", ".", "99"]"

语法

formatToParts(number)

参数

数字

要格式化的 Number、BigInt 或字符串。字符串的解析方式与 数字转换 中的方式相同，但 formatToParts() 会使用字符串表示的精确值，避免在隐式转换为数字时丢失精度。

返回值

一个包含格式化数字部分的对象数组。每个对象有两个属性：type 和 value，每个属性都包含一个字符串。按顺序连接 value 字符串将得到与 format() 相同的字符串。type 可能是以下之一：

literal

格式模式中的任何字符串部分；例如 " "。请注意，像小数点分隔符或加/减号这样的常见标记有自己的标记类型。

integer

数字的整数部分，如果使用分组（由 options.useGrouping 控制）则为其一部分。

group

分组分隔符字符串，例如 ","。仅在使用分组时出现（由 options.useGrouping 控制）。

decimal

小数点分隔符字符串，例如 "."。仅在 fraction 存在时出现。

fraction

数字的小数部分。

compact

紧凑型指数，例如 "M" 或 "thousands"。仅当 options.notation 为 "compact" 时出现。形式（"short" 或 "long"）可以通过 options.compactDisplay 控制。

exponentSeparator

指数分隔符，例如 "E"。仅当 options.notation 为 "scientific" 或 "engineering" 时出现。

exponentMinusSign

指数负号字符串，例如 "-"。仅当 options.notation 为 "scientific" 或 "engineering" 且指数为负数时出现。

exponentInteger

指数的整数值。仅当 options.notation 为 "scientific" 或 "engineering" 时出现。

nan

表示 NaN 的字符串，例如 "NaN"。当数字是 NaN 时，这是表示数字本身的唯一标记。

infinity

表示 Infinity 或 -Infinity 的字符串，例如 "∞"。当数字是 Infinity 或 -Infinity 时，这是表示数字本身的唯一标记。

plusSign

加号，例如 "+"。

minusSign

减号，例如 "-"。

percentSign

百分号，例如 "%"。仅当 options.style 为 "percent" 时出现。

unit

单位字符串，例如 "l" 或 "litres"。仅当 options.style 为 "unit" 时出现。形式（"short"、"narrow" 或 "long"）可以通过 options.unitDisplay 控制。

currency

货币字符串，例如 "$"、"€"、"Dollar" 或 "Euro"。仅当 options.style 为 "currency" 时出现。形式（"code"、"symbol"、"narrowSymbol" 或 "name"）可以通过 options.currencyDisplay 控制。

unknown

保留给任何未被识别为上述标记的标记；应很少遇到。

示例

使用 formatToParts()

format() 方法输出本地化的、不透明的字符串，无法直接操作

const number = 3500;

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

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

但是，在许多用户界面中，您可能希望自定义此字符串的格式，或将其与其他文本交织。formatToParts() 方法将相同的信息分解为部分。

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.join() 来为某些组件插入额外的标记。

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

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

规范

浏览器兼容性

另见

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