沒錯！接下來要跟套件們合作嚕！

算時間一直都是麻煩事，簡單移動個一天兩天還可以，但一下要算時差，一下要算隔幾天，然後又要拆格式...然後就迷失在時間的洪流(?)，自己刻沒問題，但謝謝 o(-`д´- ｡)

相信大部分都是用現有的套件來輔助計算與呈現，從耳熟能詳的 moment 系列之外，還有 date-fns, dayjs 等等更多，他們就像是時間版的lodash，幫你處理大大小小日期疑難雜症。

連結供參：

• moment / luxon (同一間XD)
• date-fns
• dayjs

選用哪種都可以，筆者偏好 date-fns，之後會用它來打造 hook，但就這之前來了解一下時間本身吧！

(本篇還沒有要寫 code XD)

new Date()

new Date()

JavaScript 中建立時間就是用 new Date()，透過回傳的 Date Object 再進一步取用內容或計算，你可以在 devtool 找到發現這一長～串的方法：

其中也會看到 getUTC 等等方法，這些會取得「+0」時區的實際時間，假設正在閱讀的你們都跟筆者一樣處於「+8」，兩個時間輸出出來就會差了8小時：

const localHours = new Date().getHours()   //21 取得本地時間(+8)
const utcHours = new Date().getUTCHours()  //13 取得標準時間(+0)

Unix timestamp

是一種給UNIX系統紀錄時間的格式：

1664891752026 //單位為秒

挖這麼多秒，掐指一算是從 1970年1月1日0時0分0秒(UTC) 開始算起的，可以將 new Date() / 1 印出來看看，這個秒數不論在身材地球何處都會是一樣的結果，也就是說這樣結果會是一樣的unix timestamp：

2022-10-04T22:04:03+08:00  //1664892243000
2022-10-04T14:04:03+00:00  //1664892243000

ISO 8601 與 RFC 3339

時間本身也是有幾個版本並規範如何表示的一種標準：

ISO

ISO 就是簡稱自 International Organization for Standardization 國際化標準組織的非政府組織，像是度量單位、國家代碼、貨幣代碼等等都由組織訂定出一個國際間的交流用規範。

RFC

RFC 簡稱自 Request For Comment，比起ISO，RFC更像一個網路社群，記錄了網路大大小小的規範、協定，像是 RFC 7519 簡單講述了 JWT 的概念，也可以透過上方遨遊到 RFC 8725 看延伸的內容。 (但並非正式，有點像是在看別人的筆記XD)

ISO 8601 與 RFC 3339

兩者的時間格式其實有一點一言難盡，來看圖片好了 XD

連結在這

有時候看到 2011-10-05T14:48:00.000Z 說是 ISO 8601 / RFC 3339 其實都對，畢竟重疊區塊佔了很大一圈，不過若要論細部的規格探究...像是 ISO 有大小寫的差別 RFC 則無、T 能被空格取代...等等細節，因此前後端溝通格式時，兩邊可能都是藉由套件處理，建議先溝通好才不吵架 XD

T&Z

會看到這種時間裡面有T & Z 2011-10-05T14:48:00.000Z，

T

T 只是用來區分「日期」與「時間」的一種表示法。

Note that the "T" appears literally in the string, to indicate the beginning of the time element, as specified in ISO 8601. REF

Z

Z 又有 Zulu Time的別稱(因在軍方用無線電溝通時，Z會用zulu這個單字溝通)，也代表了 +0 這個時區。

結語

雖然沒進入到 React，不過這樣一來對時間的了解以及格式的產出多少有點想法了！

date-fns 在格式的轉換上也有很好的支援，我們接下來就來打造看看吧！