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

在 TypeScript 中格式化日期/时间

How to format Date/Time in TypeScript

您可以在 TypeScript 中格式化日期/时间,方法是使用对象上的任何内置方法,或创建一个可重用函数,根据您的要求通过利用Date内置方法来格式化日期
getFullYeargetMonth

索引.ts
// ✅ Using built in methods 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时间和时间。

对象上有许多内置方法Datename日期格式化为通常以 开头的方法to*,例如
toLocaleStringtoUTCString()

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

以下函数使用内置方法获取特定日期的 、 、 、 和秒
year并将monthdate格式化
hour.minutesYYYY-MM-DD hh:mm:ss

您可以轻松调整日期和时间的格式,甚至删除时间部分。您可以简单地重新排列数组中的元素,删除不需要的元素,或将分隔符从连字符更改-为正斜杠,例如/

索引.ts
// ✅ 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相关方法。

  • Date.getFullYear
    方法 – 返回代表与日期对应的年份的四位数字。

  • Date.getMonth0 – 返回一个介于(January) 和(December)之间的整数11,代表给定日期的月份。是的,不幸的是该getMonth方法已关闭1

  • Date.getDate1 – 返回一个介于和之间的整数,31表示特定日期的月中日期。

  • Date.getHours – 返回指定日期的小时数。

  • Date.getMinutes – 返回日期的分钟数。

  • Date.getSeconds – 返回特定日期的秒数。

getMonth方法返回从 0 到 11 的从零开始的月份索引,表示一月是0,十二月是11

getMonth方法是从零开始的,所以我们将 1 添加到它的返回值。

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

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

这让我们得到了格式为yyyy-mm-dd.

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

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

我们使用加法 (+) 运算符在字符串中间添加一个空格,以获得格式为yyyy-mm-dd hh:mm:ss.

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

发表评论