使用toLocaleTimeString()时numeric分钟仍显示前导零的问题

问题描述 #

我遇到的情况和《toLocaleTimeString() always showing leading zero》类似，需要把时间格式化为分钟无前导零、秒带前导零的mm:ss形式（比如9:09）。但调用Date.toLocaleTimeString()并传入DateTimeFormat参数{ minute: "numeric", second: "2-digit" }时，得到的结果却是09:09。奇怪的是，只设置minute: "numeric"时，能正常输出不带前导零的9。我查了MDN的DateTimeFormat文档没找到原因，在最新版Chrome和Firefox中测试结果一致。

我有两个疑问：

1. 这是不是本地化等个人环境问题？（我已经指定了en-US）
2. 怎么实现我需要的时间格式？

解答 #

1. 是否是个人环境问题？ #

不是。这是Intl.DateTimeFormat的内置规则——当同时指定numeric类型的分钟和2-digit类型的秒时，浏览器会自动统一格式为带前导零的形式，哪怕单独设置分钟为numeric也会被覆盖。这个行为在主流浏览器中是统一的，和你的本地化环境无关，就算指定en-US也会触发这个逻辑。

2. 实现需求格式的方法 #

推荐两种简单有效的方式：

• 拆分格式化后拼接：分别单独格式化分钟和秒，再手动组合成目标格式：

const date = new Date();
const minute = date.toLocaleTimeString('en-US', { minute: 'numeric' });
const second = date.toLocaleTimeString('en-US', { second: '2-digit' });
const formattedTime = `${minute}:${second}`; // 示例输出：9:09

• 字符串替换处理：先获取带前导零的完整mm:ss格式，再移除分钟的前导零：

const date = new Date();
const fullTime = date.toLocaleTimeString('en-US', { minute: '2-digit', second: '2-digit' });
const formattedTime = fullTime.replace(/^0/, ''); // 示例输出：9:09

内容的提问来源于stack exchange，提问作者Robin Métral