前言
日期和時間不僅是日常生活的關鍵組成部分，也是電腦編程的一部分。無論您是需要它們來預約還是顯示日曆，都有許多原因需要日期和時間。日期和時間功能的應用非常廣泛且極具多樣性。這種多樣性源於您可以根據用戶配置時間和日期。位於不同地理位置的每個用戶都將根據其時區獲得不同的結果。這些功能用於具有預約介面和預訂系統（如餐廳）的網站。
程式設計師經常使用 JavaScript 來為他們的網站添加日期和時間功能。這是因為 JavaScript 已經具有內建功能 來處理這些方面。在本教學中，我們將進一步探討 Date 物件。我們將討論可用於為網站配置理想日期和時間設定的方法。我們還將介紹如何變更格式等內容。
什麼是 Date 物件？
正如我們剛才提到的，JavaScript 具有內建的日期和時間功能。它被稱為 Date 物件。此物件可讓您變更和管理日期和時間的相關資料。當您為 Date 建立實例時，會建立一個新物件。該物件對應於您電腦當時的日期和時間設定。
為了更好地理解此物件的運作方式，讓我們來看一個例子。我們首先建立一個變數。然後我們將為其分配一個給定的日期。假設這一天是星期三，日期是倫敦（GMT）時區的 10 月 18 日。看看這個配置：
|
1 2 3 4 |
// 將變數設定為當前日期和時間 const now = new Date(); // 查看輸出 Now; |
|
1 2 3 |
輸出 Wed Oct 18 2017 12:41:34 GMT+0000 (UTC) |
我們的輸出顯示了一個日期字串。它由以下資料組成：
| 星期幾 | 月份 | 日 | 年份 | 小時 | 分鐘 | 秒 | 時區 |
| Wed | Oct | 18 | 2017 | 12 | 41 | 34 | GMT+0000 (UTC) |
JavaScript 透過時間戳記接收資料。此時間戳記來自 Unix 時間。這是一個顯示自 1970 年 1 月 1 日午夜以來經過的毫秒數的值。對於用戶來說，日期以易於理解的格式顯示。如果您想獲取此時間戳記，您必須使用 getTime() 方法，如下所示：
|
1 2 3 |
// 獲取當前時間戳記 now.getTime(); |
|
1 2 3 |
輸出 1508330494000 |
雖然這個值看起來令人困惑，但它代表與日期字串相同的內容。它就是 2017 年 10 月 18 日。
什麼是 Epoch 時間？
下一個要學習的概念是 Epoch 時間。它也被稱為零時間。您可以將其更好地理解為資料字串
01 1 月, 1970 00:00:00 世界 時間 (UTC) 以及 0 時間戳記。要測試它，請建立一個新變數。然後將其分配給一個新的
Date 實例，基於 0 時間戳記：
|
1 2 3 4 5 |
// 將時間戳記 0 分配給一個新變數 const epochTime = new Date(0); epochTime; |
|
1 2 3 |
輸出 01 1 月, 1970 00:00:00 世界 時間 (UTC) |
Epoch 時間曾是程式設計師的標準。它也是 JavaScript 用來測量時間的方法。
在 JavaScript 中建立日期的格式
現在我們知道如何使用字串和時間戳記建立新的 Date 實例，我們可以討論不同的格式。共有四種格式，詳細說明如下：
這意味著您可以根據需要指定特定的日期和時間。您也可以像我們之前討論的那樣，簡單地使用資料字串或時間戳記。為了便於理解，我們將觀察如何以三種不同的方式建立新的 Date 物件。假設我們的日期和時間是 1776 年 7 月 4 日下午 12:30 GMT：
|
1 2 3 4 5 6 7 8 |
// 時間戳記方法 new Date(-6106015800000); // 日期字串方法 new Date("July 4 1776 12:30"); // 日期與時間方法 new Date(1776, 6, 4, 12, 30, 0, 0); |
如你所見，這三種方法輸出的日期都相同。其中一個區別是，如果你使用的是 Unix 紀元（Epoch）之前的時間，時間戳記將顯示為負數。此外，在日期和時間方法中，秒和毫秒預設為 0。如果你忘記輸入數字，它也會預設設定為 0。
另一個令人困惑的地方是，七月是用 6 而不是 7 來表示。這是因為編號是從 0 開始的。在建立實例時，請記住這些事情。
使用 get 指令來獲取日期
現在日期已經設定好了，讓我們來看看如何存取它的組成部分。其中一種方法是使用 get 指令。此表格顯示了 get 方法，適用於 Date 物件：
在這個範例中，我們將為一個新變數分配一個新日期，即 1980 年 7 月 31 日：
|
1 2 |
// 初始化一個新的生日實例 const birthday = new Date(1980, 6, 31); |
如果使用此方法獲取所有單獨的日期組成部分，它看起來會像這樣：
|
1 2 3 4 5 6 7 8 9 |
birthday.getFullYear(); // 1980 birthday.getMonth(); // 6 birthday.getDate(); // 31 birthday.getDay(); // 4 birthday.getHours(); // 0 birthday.getMinutes(); // 0 birthday.getSeconds(); // 0 birthday.getMilliseconds(); // 0 birthday.getTime(); // 333849600000 (GMT 時間) |
在某些情況下，你可能只需要日期的某個特定部分。你可以使用這些方法來做到這一點。以下是如何測試以確認是否為 10 月 3 日的方法：
|
1 2 3 4 5 6 7 8 |
// 獲取今天的日期 const today = new Date(); // 將今天與 10 月 3 日進行比較 if (today.getDate() === 3 && today.getMonth() === 9) { console.log("今天是 10 月 3 日。"); } else { console.log("今天不是 10 月 3 日。"); } |
|
1 2 3 |
輸出 這'是 不是 10月 3日。 |
如果日期不是 10 月 3 日，而你對其進行測試，這就是你會得到的輸出。
使用 set 指令來修改日期
與 get 指令類似，你也有對應的 set 指令。此指令可讓你修改日期組成部分。此表格顯示了所有方法：
假設我們想將變數 birthday 從 1997 修改為 1980:
|
1 2 3 |
// 修改生日日期的年份 birthday.setFullYear(1997); birthday; |
|
1 2 3 |
輸出 Thu Jul 31 1997 00:00:00 GMT+0000 (UTC) |
現在我們的輸出顯示了新的年份。你也可以類似地修改日期的其他組成部分。
JavaScript 中的 UTC 日期方法
如果你使用 get 方法提取日期組成部分，你將根據使用者時區的本機系統設定來接收它們。或者，你可以將其設定為根據 UTC 標準計算時間。UTC 代表協調世界時。你可以使用 getUTC 方法來做到這一點。此表格顯示了 JavaScript 中 Date 物件的所有 UTC 方法：
如你所見，所有方法都與 get 指令類似。然而，輸出會有所不同。你可以使用以下程式碼來測試其差異：
|
1 2 3 4 5 6 |
// 將目前時間分配給變數 const now = new Date(); // 列印本地和 UTC 時區 console.log(now.getHours()); console.log(now.getUTCHours()); |
這段程式碼將向您顯示目前的小時以及 UTC 時區的小時。如果您已經處於 UTC 時區，這些數字將會相同。使用 UTC 的原因在於它能確保跨國際時區和地區的一致性。
結論
在本教學中，我們介紹了各種用於 Date 物件的方法。這包括如何使用 get 獲取日期元件，以及如何使用 set 修改它們。我們還探討了 UTC 時區以及如何在 JavaScript 中使用它們。
歸根結底，JavaScript 擁有大量內建的日期和時間功能。這使得編寫複雜網站的程式變得相當簡單。您可以在 Mozilla Developer Network 上閱讀更多關於 JavaScript 日期和時間功能的資訊。不過，本教學應該能幫助您掌握最基本的基礎知識。
以下是更多來自 我們部落格 的資源，這將使您在使用 JavaScript 程式設計時更加輕鬆：
祝您程式設計愉快！
留言
目前尚無留言。成為第一個留言的人吧。