如何在 TypeScript 中格式化日期/时间

我们可以在 TypeScript 中格式化日期/时间，方法是使用 Date 对象上的任何内置方法，或者创建一个可重用的函数，通过利用 getFullYear、getMonth 等内置方法根据要求格式化日期。

// ✅ 使用内置方法
const date = new Date();

console.log(date.toLocaleString()); // ?️ "3/7/2022, 4:11:58 PM"
console.log(date.toLocaleDateString()); // ?️ "3/7/2022"
console.log(date.toLocaleTimeString()); // ?️ "3/7/2022"

console.log(date.toUTCString()); // ?️ "Mon, 07 Mar 2022 14:12:34 GMT"

// ✅ Format using reusable function
function padTo2Digits(num: number) {
  return num.toString().padStart(2, '0');
}

// ?️ format as "YYYY-MM-DD hh:mm:ss"
// You can tweak formatting easily
function formatDate(date: Date) {
  return (
    [
      date.getFullYear(),
      padTo2Digits(date.getMonth() + 1),
      padTo2Digits(date.getDate()),
    ].join('-') +
    ' ' +
    [
      padTo2Digits(date.getHours()),
      padTo2Digits(date.getMinutes()),
      padTo2Digits(date.getSeconds()),
    ].join(':')
  );
}

const result = formatDate(new Date());
console.log(result); //  ?️ "2022-03-07 16:10:22"

代码片段中显示的第一种方法使用 Date 对象上的内置方法来格式化日期和时间。

Date 对象有许多内置方法。 将日期格式化为通常以 to* 开头的方法的名称，例如 toLocaleString 或 toUTCString()。

如果没有内置方法提供我们需要的格式，我们可以创建一个可重用的函数，根据用例格式化日期。

以下函数使用内置方法获取特定日期的年、月、日、时、分和秒，并将其格式化为 YYYY-MM-DD hh:mm:ss。

我们可以轻松调整日期和时间的格式，甚至删除时间组件。 我们可以简单地重新排序数组中的元素，删除不需要的元素，或从连字符 – 更改分隔符，例如 正斜杠 /。

// ✅ Format using reusable function
function padTo2Digits(num: number) {
  return num.toString().padStart(2, '0');
}

// ?️ format as "YYYY-MM-DD hh:mm:ss"
// You can tweak formatting easily
function formatDate(date: Date) {
  return (
    [
      date.getFullYear(),
      padTo2Digits(date.getMonth() + 1),
      padTo2Digits(date.getDate()),
    ].join('-') +
    ' ' +
    [
      padTo2Digits(date.getHours()),
      padTo2Digits(date.getMinutes()),
      padTo2Digits(date.getSeconds()),
    ].join(':')
  );
}

const result = formatDate(new Date());
console.log(result); //  ?️ "2022-03-07 16:10:22"

我们做的第一件事是创建一个 padTo2Digits 函数，如果月、日、小时、分钟或秒只包含一个数字（小于 10），它将负责添加前导零。

我们要确保结果始终保持一致，并且有 2 位数字表示月、日、小时、分钟和秒，因此我们使用了 padStart 方法。

接下来，我们创建了一个函数，它接受一个日期并将其格式化为 yyyy-mm-dd hh:mm:ss。

该函数使用以下 6 种与日期相关的方法。

• Date.getFullYear – 返回一个四位数字，表示对应于日期的年份。
• Date.getMonth – 返回一个介于 0（一月）和 11（十二月）之间的整数，表示给定日期的月份。是的，不幸的是 getMonth 方法关闭了 1。
• Date.getDate – 返回一个介于 1 到 31 之间的整数，表示特定日期的月份日期。
• Date.getHours – 返回指定日期的小时数。
• Date.getMinutes – 返回日期的分钟数。
• Date.getSeconds – 返回特定日期的秒数。

getMonth 方法返回从 0 到 11 的从零开始的月份索引，这意味着一月是 0，十二月是 11。

getMonth 方法是从零开始的，所以我们在它的返回值上加了 1。

我们将年、月和日放在一个数组中，因此我们可以用连字符分隔符将它们连接起来。

console.log(['2023', '04', '28'].join('-')); // ?️ '2023-04-28'
console.log(['2025', '07', '19'].join('-')); // ?️ '2025-07-19'

这让我们得到格式为 yyyy-mm-dd 的日期。

下一步是将时间相关方法的返回值放在一个数组中，并用冒号连接它们。

console.log(['07', '30', '45'].join(':')); // ?️ '07:30:45'
console.log(['09', '16', '51'].join(':')); // ?️ '09:16:51'

我们使用加法 (+) 运算符在字符串中间添加一个空格，以获取格式为 yyyy-mm-dd hh:mm:ss 的日期。

我们可以轻松地对两个数组中的元素重新排序，或者将分隔符从连字符更改为正斜杠，从而以不同的方式格式化日期。

火焰兔

海报 链接