如何在紧凑格式中选择 1K 和 1 千

简介

当你使用紧凑表示法格式化大数字时，数字 1500 默认会显示为 1.5K。这种缩写格式非常适合空间有限的界面，比如移动端屏幕和仪表盘卡片。但在某些场景下，拼写出数量级会更清晰。同样的数字也可以显示为 1.5 千，而不是 1.5K，以清晰度换取简洁性。

JavaScript 的 Intl.NumberFormat 提供了 compactDisplay 选项来控制这一选择。你可以选择 short（短格式），使用 K、M、B 等缩写，或 long（长格式），将数量级拼写为 thousand、million、billion。该选项让你可以精确控制紧凑数字的显示方式。

compactDisplay 选项的作用

compactDisplay 选项仅在你将 notation 设置为 "compact" 时有效。它接受两个值："short" 和 "long"。short 值会生成如 1.5K 这样的缩写输出，而 long 值会生成如 1.5 千这样的拼写输出。

const shortFormatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "short"
});

console.log(shortFormatter.format(1500));
// Output: "1.5K"

const longFormatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "long"
});

console.log(longFormatter.format(1500));
// Output: "1.5 thousand"

compactDisplay 选项如果省略，默认值为 "short"。这意味着紧凑表示法会使用缩写，除非你明确指定 long 格式。

使用短格式紧凑显示数字

短格式紧凑显示使用单字母缩写来表示数量级。这种格式在保持可读性的同时最大限度地节省了横向空间。

const formatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "short"
});

console.log(formatter.format(1500));
// Output: "1.5K"

console.log(formatter.format(2400000));
// Output: "2.4M"

console.log(formatter.format(7800000000));
// Output: "7.8B"

console.log(formatter.format(5600000000000));
// Output: "5.6T"

格式化器会根据数字的数量级自动选择合适的缩写。千用 K，百万用 M，十亿用 B，万亿用 T。

短格式显示适用于需要在有限空间内展示数字的场景。例如，移动端界面、数据表格、图表标签和仪表盘卡片等，都能从数字缩写的紧凑宽度中受益。

使用长格式紧凑显示数字

长格式紧凑显示会将数量级的词语完整拼写出来，而不是缩写。虽然这种格式会占用更多的横向空间，但能带来更高的清晰度。

const formatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "long"
});

console.log(formatter.format(1500));
// Output: "1.5 thousand"

console.log(formatter.format(2400000));
// Output: "2.4 million"

console.log(formatter.format(7800000000));
// Output: "7.8 billion"

console.log(formatter.format(5600000000000));
// Output: "5.6 trillion"

格式化器会使用完整的数量级词语，使数字的规模一目了然，无需用户去理解缩写。对于不熟悉 K、M、B 这类缩写的用户来说，直接看到“千”、“百万”、“十亿”会更易于理解。

长格式显示适用于对清晰度要求高于空间限制的场景。例如，教育内容、财务报告、注重无障碍的界面和正式文档等，都适合使用完整拼写的数量级。

对比短格式与长格式紧凑显示

当你用这两种方式格式化同一组数字时，短格式和长格式的区别会非常明显。

const shortFormatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "short"
});

const longFormatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "long"
});

const numbers = [1500, 45000, 2400000, 950000000];

numbers.forEach(num => {
  console.log(`${num}:`);
  console.log(`  Short: ${shortFormatter.format(num)}`);
  console.log(`  Long:  ${longFormatter.format(num)}`);
});

// Output:
// 1500:
//   Short: 1.5K
//   Long:  1.5 thousand
// 45000:
//   Short: 45K
//   Long:  45 thousand
// 2400000:
//   Short: 2.4M
//   Long:  2.4 million
// 950000000:
//   Short: 950M
//   Long:  950 million

短格式显示始终使用更少的字符。例如，K 只占一个字符，而“thousand”包含空格则有八个字符。当在表格或列表中展示大量数字时，这种差异会被放大。

长格式显示为每个数字提供了更多上下文。用户可以直接读出“2.4 million”，而无需解码 M 代表什么。对于不熟悉数字缩写格式的用户，这种明确性更友好。

紧凑显示在不同语言中的差异

无论是短格式还是长格式紧凑显示，都会根据你指定的本地化语言进行适配。不同语言有不同的缩写和数量级词语。

const locales = ["en-US", "fr-FR", "de-DE", "es-ES"];

locales.forEach(locale => {
  const shortFormatter = new Intl.NumberFormat(locale, {
    notation: "compact",
    compactDisplay: "short"
  });

  const longFormatter = new Intl.NumberFormat(locale, {
    notation: "compact",
    compactDisplay: "long"
  });

  console.log(`${locale}:`);
  console.log(`  Short: ${shortFormatter.format(2400000)}`);
  console.log(`  Long:  ${longFormatter.format(2400000)}`);
});

// Output:
// en-US:
//   Short: 2.4M
//   Long:  2.4 million
// fr-FR:
//   Short: 2,4 M
//   Long:  2,4 millions
// de-DE:
//   Short: 2,4 Mio.
//   Long:  2,4 Millionen
// es-ES:
//   Short: 2,4 M
//   Long:  2,4 millones

法语在“million”复数时会加 s。德语短格式用 Mio.，长格式用 Millionen。西班牙语复数用 millones。每种语言都对短格式和长格式应用了自己的语法规则。

格式化程序会根据不同的本地化设置自动处理这些差异。您无需为每种语言单独维护格式化逻辑。

亚洲语言通常采用完全不同的数字分组系统。

const jaFormatter = new Intl.NumberFormat("ja-JP", {
  notation: "compact",
  compactDisplay: "short"
});

console.log(jaFormatter.format(15000000));
// Output: "1500万"

const zhFormatter = new Intl.NumberFormat("zh-CN", {
  notation: "compact",
  compactDisplay: "short"
});

console.log(zhFormatter.format(15000000));
// Output: "1500万"

日语和中文按一万为单位分组，而不是按一千。字符万表示一万，因此 15,000,000 会写作 1500 万，而不是 15M。Intl API 会自动处理这些数字系统的根本差异。

何时使用短紧凑显示

短紧凑显示最适用于空间受限、每个字符都很重要的场景。移动端界面横向空间有限，缩写数字对于内容适配屏幕至关重要。

显示多个数字的数据表格受益于统一的宽度。使用 1.5K、2.4M 和 7.8B 可以保持列对齐，防止换行。统一的缩写格式有助于用户快速浏览数字列。

仪表盘卡片和指标面板采用短显示以最大化信息密度。一个展示粉丝数、浏览量和多平台互动指标的仪表盘，需要紧凑格式以便所有指标同时显示在屏幕上。

图表坐标轴和标签需要尽量简短的文本，以避免重叠或拥挤。用 1.5M 替代 1.5 million 可以让坐标轴标签保持可读，无需旋转或截断。

交互式地图和数据可视化在以叠加或工具提示形式显示数字时，短显示同样有优势。缩写格式可防止文本遮挡底层内容。

何时使用长紧凑显示

当清晰度和可访问性比空间效率更重要时，长紧凑显示效果最佳。用于教学大数字的教育内容适合用全称表达数量级。学生在学习人口统计或经济数据时，需要明确的数量级词语来理解规模。

财务报告和正式文件通常采用全称显示，以避免歧义。例如，业务报告中写明 240 万元收入，比写 2.4M 更清晰，尤其是对于不熟悉缩写惯例的读者。

以无障碍为重点的界面更适合使用全称显示，因为屏幕阅读器朗读完整单词时更自然。例如，屏幕阅读器朗读“1.5 thousand”比“1.5K”更自然，后者可能会被读作“一点五 K”或“一点五凯”。

印刷版版面比数字界面有更多横向空间，因此全称显示更为实用。印刷报告、信息图和演示文稿可以容纳更多字符，不会造成版面问题。

在用户可能不熟悉缩写的场景下，应使用全称显示。国际用户、非技术用户或数字素养较低的用户更容易识别“thousand”、“million”、“billion”，而不是“K”、“M”、“B”。

将紧凑显示与其他格式选项结合使用

compactDisplay 选项可与所有其他数字格式选项配合使用。你可以在选择短格式或长格式的同时，控制小数位数、分组等格式。

const formatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "long",
  maximumFractionDigits: 2
});

console.log(formatter.format(1234567));
// Output: "1.23 million"

console.log(formatter.format(9876543));
// Output: "9.88 million"

maximumFractionDigits 选项用于控制小数精度，而 compactDisplay 控制数量级格式。这些选项可协同工作，生成你所需的精确格式。

你可以将紧凑显示与货币格式结合，显示带有全称数量级的金额。

const formatter = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD",
  notation: "compact",
  compactDisplay: "long"
});

console.log(formatter.format(2400000));
// Output: "$2.4 million"

console.log(formatter.format(750000));
// Output: "$750 thousand"

这种格式适用于在财务报告或预算摘要中显示大额货币数值，货币符号和全称数量级共同提升了清晰度。

紧凑显示还可与符号显示结合，用于展示变化值或增减量。

const formatter = new Intl.NumberFormat("en-US", {
  notation: "compact",
  compactDisplay: "long",
  signDisplay: "always"
});

console.log(formatter.format(1500000));
// Output: "+1.5 million"

console.log(formatter.format(-850000));
// Output: "-850 thousand"

显式符号与拼写数量级的结合，使用户能够立即清楚地看到变化。

需要记住的要点

compactDisplay 选项用于控制紧凑表示法是使用缩写还是全拼。设置为 "short" 时，输出如 1.5K 这样的缩写格式；设置为 "long" 时，输出如 1.5 thousand 这样的全拼格式。如果未设置该选项，默认值为 "short"。

当空间有限或需要显示大量需保持宽度一致的数字时，建议使用短格式显示。当清晰度和可访问性比空间效率更重要时，建议使用长格式显示。格式化器会自动处理短格式和长格式下的本地化差异。

可以将 compactDisplay 与小数位数、货币、符号显示等其他格式选项结合，创建应用所需的精确数字格式。