使用 Vanilla JavaScript 格式化日期时间

Question

有许多库，例如 moment ，允许您在 JavaScript 中格式化日期。 但是，基本日期格式不需要它们：内置 Date#toLocaleString() 函数 允许您将日期转换为自定义字符串格式，而无需外部库。

介绍 toLocaleString()

这 toLocaleString()函数有 2 个参数：

1. 一个字符串 locale表示 日期的高级格式 ，例如 'en-US'或者 'default'.
2. 一个东西 options包含如何格式化各种日期组件，例如 month或者 minutes. 这是 完整的列表 toLocaleDateString() 选项

这是格式化日期以包含工作日的简短形式和完整日期的示例。

// No 'Z' at the end means JavaScript will use the server's timezone
// as opposed to UTC.
const date = new Date('2019-06-01T00:00:00.000');

// "Sat, June 01, 2019"
date.toLocaleString('en-US', {
  weekday: 'short', // "Sat"
  month: 'long', // "June"
  day: '2-digit', // "01"
  year: 'numeric' // "2019"
});

注意： 不要混淆 toLocaleString() 和 toLocaleDateString()。这 toLocaleDateString() 功能类似于 toLocaleString()，但默认情况下它不包括日期的时间部分。

const date = new Date('2019-06-01T08:00:00.000');

// "6/1/2019, 8:00:00 AM"
date.toLocaleString('en-US');
// "6/1/2019" with no time portion
date.toLocaleDateString();

// But you can still include `hours` and `minutes` using options
// with `toLocaleDateString()`.
date.toLocaleDateString('en-US', {
  month: 'long',
  day: '2-digit',
  year: 'numeric',
  hour: '2-digit'
}); // "June 01, 2019, 8 AM"

时区

这 toLocaleString() 函数还允许您指定一个时区来格式化日期。支持哪些时区是 特定于实现的 ，因此您不应该依赖命名的时区，如 America/Los_Angeles”或“America/New_York 而不先测试您的环境。 例如，Node.js 从你的 OS 中提取时区数据 ，这意味着你的 Node 进程很可能有时区数据，但这并不是严格保证的。

以下是使用特定时区格式化 UTC 日期的示例， 'America/Denver'。

const date = new Date('2019-06-01T08:00:00.000Z');
// "June 01, 2019, 2 AM"
date.toLocaleDateString('en-US', {
  month: 'long',
  day: '2-digit',
  year: 'numeric',
  hour: '2-digit',
  timeZone: 'America/Denver' // 6 hours behind UTC
});

限制

这 toLocaleString() 函数对于简单的人类可读格式来说已经足够好了，但它没有与 moment 。

例如， toLocaleString() 没有办法输出日期 YYYYMMDD 格式，例如 2019 年 6 月 1 日的 20190601。您可以在 YYYY-MM-DD，但您必须猜测兼容的语言环境。 没有办法输出 YYYY-MM-DD 使用 'en-US' 语言环境，但您可以使用 'fr-CA' 当地的。

const date = new Date('2019-06-01T00:00:00.000');
// "June 01, 2019, 2 AM"
date.toLocaleDateString('fr-CA', {
  year: 'numeric',
  month: '2-digit',
  day: '2-digit'
});

不幸的是，找出正确的语言环境需要反复试验。 如果您需要比 2019 年 6 月 1 日 更强大的格式，最好使用 moment。