JavaScript Date 演練場

輸入一個 JavaScript Date 運算式,即時探索每一種輸出格式和屬性 —— toISOString、toString、getTime、getFullYear 等。

JavaScript 的 Date 物件

JavaScript 內建的 Date 物件在內部以自 Unix 紀元(1970 年 1 月 1 日 00:00:00 UTC)以來的毫秒數儲存時間。每個 Date 實例歸根究柢就是這一個整數。toISOString()、toString()、toLocaleString() 等各種方法只是顯示同一底層值的不同方式。

使用 JavaScript 日期時的常見陷阱

Date 的若干行為會讓有經驗的開發者也犯錯:

  • 月份從零開始:一月是 0,十二月是 11——顯示時務必加 1
  • new Date('2024-01-01') 解析為 UTC 午夜;new Date('2024/01/01') 解析為本地午夜
  • new Date(2024, 0, 1) 以本地時間建構 2024 年 1 月 1 日(月份從 0 開始)
  • Date.now() 回傳毫秒;Math.floor(Date.now() / 1000) 得到 Unix 秒
  • 不要用加 86400000 ms 來加一天——日光節約時間可能使其落在錯誤的時刻

在 JavaScript 中處理時區

JavaScript 的 Date 物件沒有時區屬性——它始終以 UTC 儲存。時區轉換在顯示時透過 Intl.DateTimeFormat API 完成。

  • new Intl.DateTimeFormat('en-US', { timeZone: 'Asia/Tokyo', dateStyle: 'full', timeStyle: 'long' }).format(date)
  • date.toLocaleString('zh-CN', { timeZone: 'Asia/Shanghai' })
  • new Intl.DateTimeFormat('en-CA', { timeZone: tz }).formatToParts(date) —— 回傳各部分以便自訂格式

如何解讀 playground 的輸出

playground 以多個檢視呈現同一個 Date 值,便於快速發現單位與時區錯誤。先比較 getTime 與 Unix 秒,再查看 ISO 與本地字串。如果 ISO 日期正確但本地字串看起來不同,代表時間戳沒錯,只是顯示時區變了。

  • getTime 始終是自 Unix 紀元以來的毫秒
  • Unix 秒是 getTime 除以 1000 後向下取整
  • toISOString 始終以結尾帶 Z 的 UTC 顯示
  • 除非以選項覆寫,toString 與 toLocaleString 以瀏覽器本地時區顯示