如何显示时间的毫秒或微秒?

使用 Intl.DateTimeFormat 在时间显示中呈现亚秒级精度

引言

大多数时间显示只包含小时、分钟和秒。这种精度适用于日程安排、预约和日常计时。然而,一些应用需要亚秒级精度,以显示十分之一、百分之一或千分之一秒。

性能监控工具会以毫秒为单位显示响应时间。科学应用会以亚秒级精度显示测量结果。视频和音频应用会将时间戳精确到毫秒。日志系统会用带有小数秒的时间戳记录事件,以区分发生时间非常接近的事件。

JavaScript 的 Intl.DateTimeFormat 提供 fractionalSecondDigits 选项,可用于显示亚秒级精度。本课程将介绍什么是小数秒、如何显示它们,以及在何种场景下需要这种精度。

理解小数秒精度

秒是时间测量的基本单位。小数秒表示小于一整秒的时间片段。

十分之一秒等于 0.1 秒,也就是 100 毫秒。这种精度可以区分在十分之一秒内发生的不同事件。

百分之一秒等于 0.01 秒,也就是 10 毫秒。这种精度可以区分在百分之一秒内发生的不同事件。

千分之一秒等于 0.001 秒,也就是 1 毫秒。这是 Intl.DateTimeFormat 支持的最高精度。

JavaScript 通过小数点后的数字来表示小数秒。一位数字表示十分之一秒,两位表示百分之一秒,三位表示千分之一秒。

关于微秒

课程标题提到了微秒,但 Intl.DateTimeFormat 不支持微秒级精度。微秒是秒的百万分之一,需要小数点后六位数字。而该 API 最多支持三位小数,即毫秒级精度。

JavaScript 的 Date 对象在内部以自 1970 年 1 月 1 日 UTC 起的毫秒数存储时间。这意味着底层数据支持毫秒级精度,但不支持微秒级精度。

使用 fractionalSecondDigits 选项

fractionalSecondDigits 选项用于控制秒字段小数点后显示的位数。它可接受的值为 1、2 或 3。

在使用 fractionalSecondDigits 时,必须包含 second 选项。如果没有 second 选项,格式化器会省略秒字段,分数秒选项也不会生效。

const date = new Date('2025-10-15T14:23:45.678');

const formatter = new Intl.DateTimeFormat('en-US', {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  fractionalSecondDigits: 3
});

console.log(formatter.format(date));
// Output: "2:23:45.678 PM"

该格式化器会显示小时、分钟、秒以及三位小数的分数秒。Date 对象本身具有毫秒级精度,格式化器会完整显示这三位数字。

显示一位分数秒

fractionalSecondDigits 设置为 1 时,会显示十分之一秒。

const date = new Date('2025-10-15T14:23:45.678');

const formatter = new Intl.DateTimeFormat('en-US', {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  fractionalSecondDigits: 1
});

console.log(formatter.format(date));
// Output: "2:23:45.6 PM"

格式化器会将值四舍五入到一位小数。原始值为 678 毫秒,即 0.678 秒,显示为一位小数时会向下取整为 0.6 秒。

显示两位分数秒

fractionalSecondDigits 设置为 2 时,会显示百分之一秒。

const date = new Date('2025-10-15T14:23:45.678');

const formatter = new Intl.DateTimeFormat('en-US', {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  fractionalSecondDigits: 2
});

console.log(formatter.format(date));
// Output: "2:23:45.67 PM"

格式化器会将值四舍五入到两位小数。678 毫秒等于 0.678 秒,显示为两位小数时会向下取整为 0.67 秒。

显示三位小数秒

fractionalSecondDigits 设置为 3 时,会显示千分之一秒,也就是毫秒。

const date = new Date('2025-10-15T14:23:45.678');

const formatter = new Intl.DateTimeFormat('en-US', {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  fractionalSecondDigits: 3
});

console.log(formatter.format(date));
// Output: "2:23:45.678 PM"

这会显示 JavaScript Date 对象中可用的完整毫秒精度。三位数字是 Intl.DateTimeFormat 支持的最大精度。

与 24 小时制时间格式结合使用

小数秒可与任何时间格式选项配合使用,包括 24 小时制。

const date = new Date('2025-10-15T14:23:45.678');

const formatter = new Intl.DateTimeFormat('en-GB', {
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit',
  fractionalSecondDigits: 3,
  hourCycle: 'h23'
});

console.log(formatter.format(date));
// Output: "14:23:45.678"

英国英语区域默认使用 24 小时制,hourCycle 选项可确保采用 24 小时格式。小数秒会以小数点分隔符显示在秒数之后。

在小数秒中包含时区信息

可以将小数秒与时区信息一起显示。

const date = new Date('2025-10-15T14:23:45.678Z');

const formatter = new Intl.DateTimeFormat('en-US', {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  fractionalSecondDigits: 3,
  timeZone: 'America/New_York',
  timeZoneName: 'short'
});

console.log(formatter.format(date));
// Output: "10:23:45.678 AM EDT"

此格式化器会将 UTC 时间转换为纽约时间,并以毫秒精度和时区缩写显示结果。

各区域小数秒格式的差异

不同区域在数字中使用不同的小数分隔符,但所有区域在小数秒中都统一使用句点作为小数分隔符。

const date = new Date('2025-10-15T14:23:45.678');
const options = {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  fractionalSecondDigits: 3
};

const en = new Intl.DateTimeFormat('en-US', options);
console.log(en.format(date));
// Output: "2:23:45.678 PM"

const de = new Intl.DateTimeFormat('de-DE', options);
console.log(de.format(date));
// Output: "14:23:45.678"

const fr = new Intl.DateTimeFormat('fr-FR', options);
console.log(fr.format(date));
// Output: "14:23:45.678"

const ar = new Intl.DateTimeFormat('ar-SA', options);
console.log(ar.format(date));
// Output: "٢:٢٣:٤٥٫٦٧٨ م"

英语使用 12 小时制并带有 AM/PM。德语和法语使用 24 小时制。阿拉伯语使用阿拉伯-印度数字,但时间格式结构保持一致。所有区域在小数秒部分都使用句点或类似分隔符。

小数秒的常见应用场景

性能监控会以毫秒精度显示响应时间。

const startTime = new Date();
// Perform operation
const endTime = new Date();

const formatter = new Intl.DateTimeFormat('en-US', {
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit',
  fractionalSecondDigits: 3,
  hourCycle: 'h23'
});

console.log(`Operation completed at ${formatter.format(endTime)}`);
// Output: "Operation completed at 14:23:45.678"

这会以毫秒精度显示精确的完成时间,便于性能分析。

科学数据记录需要亚秒级时间戳。

function logMeasurement(value) {
  const timestamp = new Date();
  const formatter = new Intl.DateTimeFormat('en-US', {
    year: 'numeric',
    month: '2-digit',
    day: '2-digit',
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit',
    fractionalSecondDigits: 3,
    hourCycle: 'h23'
  });

  console.log(`${formatter.format(timestamp)} - Measurement: ${value}`);
}

logMeasurement(23.5);
// Output: "10/15/2025, 14:23:45.678 - Measurement: 23.5"

这会为科学测量生成具有毫秒精度的时间戳。

视频播放器的时间戳显示位置支持亚秒级精度。

function formatVideoTimestamp(milliseconds) {
  const date = new Date(milliseconds);
  const formatter = new Intl.DateTimeFormat('en-US', {
    minute: '2-digit',
    second: '2-digit',
    fractionalSecondDigits: 2,
    hourCycle: 'h23',
    timeZone: 'UTC'
  });

  return formatter.format(date);
}

console.log(formatVideoTimestamp(125678));
// Output: "02:05.67"

此功能可将视频时间戳格式化为百分之一秒的精度。将时区设置为 UTC 可防止对时长值进行时区转换。

何时使用小数秒

当需要区分同一秒内发生的事件时,应使用小数秒。性能监控、调试、科学测量和媒体应用通常需要这种精度。

日常时间记录不建议使用小数秒。约会、日程安排和面向用户的时间戳很少需要亚秒级精度。增加不必要的精度会使时间更难阅读和理解。

请根据实际需求选择合适的小数位数。一位小数即可满足许多场景的精度要求且易于阅读。三位小数可提供最大精度,但会使时间戳更长且更偏技术风格。

总结

fractionalSecondDigits 选项可在时间格式化时显示亚秒级精度。它接受 1、2 或 3 作为参数,分别显示十分之一秒、百分之一秒或千分之一秒。使用 fractionalSecondDigits 时,必须同时包含 second 选项。

JavaScript 的 Intl.DateTimeFormat 支持毫秒级精度,但不支持微秒级。三位小数表示毫秒,这是可用的最高精度。

小数秒可与所有其他时间格式化选项配合使用,包括 12 小时制、24 小时制、时区和不同语言环境。小数点分隔符在各语言环境中保持一致。

请在性能监控、科学数据、调试日志和媒体时间戳中使用小数秒。对于日常时间记录,秒级精度已足够,无需使用小数秒。