在 TypeScript 中格式化日期和時間

Muhammad Maisam Abbas 2023年1月30日 2022年5月18日
  1. TypeScript 中沒有引數的日期物件
  2. TypeScript 中帶有一個引數的日期物件
  3. TypeScript 中帶有字串引數的日期物件
  4. TypeScript 中具有多個引數的日期物件
  5. 在 TypeScript 中使用 get 方法獲取日期和時間
  6. 在 TypeScript 中使用 set 方法設定日期和時間
  7. 在 TypeScript 中格式化日期和時間的方法
在 TypeScript 中格式化日期和時間

本教程將介紹內建物件 Date() 並討論在 Typescript 中獲取、設定和格式化日期和時間的各種方法。

TypeScript 中沒有引數的日期物件

每當在沒有任何引數的情況下呼叫建構函式 Date() 時,它都會返回編譯器正在執行的當前裝置的日期和時間。

例子:

let myDate: Date = new Date();
console.log('My date and time is = ' + myDate);

輸出:

My date and time is = Fri Feb 18 2022 19:45:32 GMT+0000 (Country Standard Time)

TypeScript 中帶有一個引數的日期物件

例子:

let myDate: Date = new Date(600000000000);
console.log('My date and time is = ' + myDate);

輸出:

My date and time is = Thu Jan 05 1989 15:40:00 GMT+0000 (Country Standard Time)

在上面的例子中,格式與上一個相同,但時間和日期不同。Date() 建構函式現在有一個引數毫秒 新增到編譯器開始時間和日期。

一般來說,編譯器的開始日期和時間是 Thu Jan 01 1970 00:00:00。那麼 600000000000 毫秒等於 166666.667 小時。

因此,將這些小時新增到編譯器開始日期和時間會給出輸出 Thu Jan 05 1989 15:40:00

TypeScript 中帶有字串引數的日期物件

示例 1:

let myDate: Date = new Date("2018-02-08T10:30:35");
console.log('My date and time is = ' + myDate);

輸出:

My date and time is = Thu Feb 08 2018 10:30:35 GMT+0000 (Country Standard Time)

在輸出中,顯示使用者設定的日期和時間。注意 Date() 建構函式中傳遞的引數是一個字串。

字串引數的語法:

(year-month-date T hours: minutes: seconds)

在這裡,T 將日期與時間分開。

如果使用者只提及年份,編譯器將採用預設日期和月份。

示例 2:

let myDate: Date = new Date("2018T10:30:35");
console.log('My date and time is = ' + myDate);

輸出:

My date and time is = Thu Jan 01 2018 10:30:35 GMT+0000 (Country Standard Time)

TypeScript 中具有多個引數的日期物件

示例 1:

let myDate: Date = new Date(2018, 9, 2, 12, 15, 45, 2000);
console.log('My date and time is = ' + myDate);

輸出:

My date and time is = Tue Oct 02 2018 12:15:47 GMT+0000 (Country Standard Time)

日期和時間的格式仍然與上面的示例相同,但現在,Date() 建構函式有多個引數。

多個引數的語法:

(year, month, date, hours, minutes, seconds, milliseconds)

在上面的示例中,請注意 seconds 的值是 45,而 milliseconds 的值是 2000。這就是為什麼計算的時間是 12 : 15 : 47

如果使用者只輸入四個引數,這些值將被依次賦值,其餘的將被賦予預設值。

示例 2:

let myDate: Date = new Date(2018, 9, 2, 12);
console.log('My date and time is = ' + myDate);

輸出:

My date and time is = Tue Oct 02 2018 12:00:00 GMT+0000 (Country Standard Time)

在 TypeScript 中使用 get 方法獲取日期和時間

如上所示,Date() 物件為我們提供了有關日期和時間的所有詳細資訊。如果使用者只想從整個字串中獲取一個值,則使用者必須使用內建的 get 方法來獲取相應的值。

例子:

let myDate: Date = new Date(2018, 9, 2, 12, 15, 45);
console.log('My date and time is = ' + myDate);

console.log('The year is = ' + myDate.getFullYear());
console.log('The month is = ' + myDate.getMonth());
console.log('The date is = ' + myDate.getDate());
console.log('The hours are = ' + myDate.getHours());
console.log('The minutes are = ' + myDate.getMinutes());
console.log('The seconds are = ' + myDate.getSeconds());

輸出:

My date and time is = Tue Oct 02 2018 12:15:45 GMT+0000 (Country Standard Time)
The year is = 2018
The month is = 9
The date is = 2
The hours are = 12
The minutes are = 15
The seconds are = 45

在上面的程式碼中,使用了許多內建的 get 方法。正如名稱描述它們的功能一樣,每個方法都會相應地返回值。

同樣,如果缺少任何值,將在輸出中列印預設值。獲取日期和時間還有許多其他內建方法。

在 TypeScript 中使用 set 方法設定日期和時間

如果使用者想要為特定實體設定新值,而不是再次例項化 Date 物件,set 方法可以提供幫助。

例子:

let myDate: Date = new Date(2018, 9, 2, 12, 15, 45);
console.log('My date and time is = ' + myDate);

myDate.setFullYear(2020);
myDate.setMonth(7);
myDate.setDate(19);
myDate.setHours(16);
myDate.setMinutes(33);
myDate.setSeconds(12);

console.log('My updated date and time is = ' + myDate);

輸出:

My date and time is = Tue Oct 02 2018 12:15:45 GMT+0000 (Country Standard Time)
My updated date and time is = Wed Aug 19 2020 16:33:12 GMT+0000 (Country Standard Time)

請注意上例中先前和更新的日期和時間之間的差異。還有許多其他內建方法可以用來設定我們可以使用的日期和時間。

在 TypeScript 中格式化日期和時間的方法

我們有許多用於格式化日期和時間的內建方法,每個方法都執行特定的操作。以下是最常用的方法。

例子:

let myDate: Date = new Date(2018, 9, 2, 12, 15, 45);
console.log('My date and time is = ' + myDate);

console.log('The ISO 8601 formatted date and time is = ' + myDate.toISOString());
console.log('The Britian formatted date and time is = ' + myDate.toLocaleString("en-GB"));
console.log('The American formatted date and time is = ' + myDate.toLocaleString("en-US"));
console.log(JSON.stringify({
    myJSONDate: myDate
}));

輸出:

My date and time is = Tue Oct 02 2018 12:15:45 GMT+0000 (Country Standard Time)
The ISO 8601 formatted date and time is = 2018-10-02T07:15:45.000Z
The Britian formatted date and time is = 02/10/2018, 12:15:45
The American formatted date and time is = 10/2/2018, 12:15:45 PM
{"myJSONDate":"2018-10-02T07:15:45.000Z"}

注意上面例子中不同的方法是如何格式化日期和時間的。使用者希望以哪種格式顯示日期和時間取決於使用者。

在 API 引用期間使用 toJSON() 方法。

toLocaleString() 用於根據地區格式化日期和時間。

toISOString() 用於根據 ISO 8601 格式格式化日期和時間。

還有許多其他方法可以格式化日期和時間。

Muhammad Maisam Abbas avatar Muhammad Maisam Abbas avatar

Maisam is a highly skilled and motivated Data Scientist. He has over 4 years of experience with Python programming language. He loves solving complex problems and sharing his results on the internet.

LinkedIn