Hello，大家好，我是 Sunday。

JavaScript 自誕生以來，處理日期和時間一直是開發(fā)者們頭疼的難題。雖然 Date 對象自 1990 年代就已經(jīng)引入，但它的問題隨著時間的推移變得愈發(fā)突出。錯誤的時區(qū)處理、復(fù)雜的日期操作以及閏秒、夏令時等問題，令 Date API 在復(fù)雜場景中幾乎無法勝任。

為了徹底解決這些歷史遺留問題，TC39 提出了全新的 Temporal API，為 JavaScript 帶來了現(xiàn)代化、精確的日期時間處理能力。

1. 現(xiàn)有 Date API 的問題

Date 對象“曾經(jīng)”是 JavaScript 中唯一內(nèi)置的日期時間處理工具。但是，它在設(shè)計(jì)上有很多缺陷：

• 時區(qū)問題：Date 默認(rèn)依賴于操作系統(tǒng)的時區(qū)配置，這導(dǎo)致不同環(huán)境下的時間處理可能不一致。
• 不可變性的缺失：Date 對象是可變的，這意味著在操作中可能會意外修改原有對象，導(dǎo)致代碼難以維護(hù)和調(diào)試。
• API 不夠完善：對于復(fù)雜的日期操作，比如加減月份或年份，Date 提供的接口既不直觀也不夠靈活，且容易出錯。
• 可能出現(xiàn)一些錯誤：Date 不能正確處理閏秒和其他復(fù)雜的時間邊界問題，這在實(shí)際應(yīng)用中經(jīng)常引發(fā)潛在錯誤。

這些問題給我們帶來了很多的困擾，導(dǎo)致我們不得不使用一些第三方的包（如：dayjs、momentjs 等）。

但是這種情況很快就要迎來變了，那就是 Temporal API！

2. Temporal API

Temporal API 的設(shè)計(jì)初衷是完全替代現(xiàn)有的 Date，提供一個更加精確、靈活、符合現(xiàn)代需求的日期時間操作工具。它通過一套全新的類和方法，重新定義了日期和時間的處理方式。

2.1 核心功能

Temporal 提供了一系列專門處理不同時間相關(guān)問題的對象和方法：

• Temporal.PlainDate：表示沒有時區(qū)的日期（如 2024-10-20）。
• Temporal.PlainTime：表示沒有時區(qū)的時間（如 14:30:00）。
• Temporal.PlainDateTime：表示沒有時區(qū)的日期和時間組合（如 2024-10-20T14:30:00）。
• Temporal.ZonedDateTime：表示帶有時區(qū)的日期和時間（如 2024-10-20T14:30:00-04:00[America/New_York]）。
• Temporal.Instant：表示唯一的、基于 UTC 的時間點(diǎn)，精確到納秒（如 2024-10-20T18:30:00.000000123Z）。

這些類型互相獨(dú)立，用戶可以根據(jù)不同的需求選擇合適的類型。例如：當(dāng)只需處理日期時可以使用 PlainDate，而在處理跨時區(qū)的問題時可以使用 ZonedDateTime。

2.2 不可變性

Temporal API 的所有對象都是不可變的，每次操作返回一個新對象，不會改變原有對象。這種設(shè)計(jì)極大地提高了代碼的可讀性和安全性，避免了意外修改導(dǎo)致的難以追蹤的錯誤。

此外，Temporal 提供了精確到納秒的時間處理，解決了 Date 只能精確到毫秒的局限，特別適合對高精度有需求的場景。

2.3 時區(qū)與日歷系統(tǒng)的支持

Temporal API 內(nèi)置了對時區(qū)和多種日歷系統(tǒng)的支持。我們可以方便地處理跨時區(qū)的時間轉(zhuǎn)換問題，而無需依賴外部庫。同時，Temporal 提供了多種日歷的支持，比如：公歷、佛歷、伊斯蘭歷等，這為國際化應(yīng)用程序提供了極大的便利。

3. Temporal API 的典型使用場景

以下示例來自 來自 TC39 文檔：https://tc39.es/proposal-temporal/docs/

示例 1：基本日期操作

const today = Temporal.PlainDate.from('2024-10-20');
const nextWeek = today.add({ days: 7 });
console.log(nextWeek.toString());  // 輸出: 2024-10-27

在這個例子中，我們創(chuàng)建了一個表示當(dāng)前日期的 PlainDate 對象，并通過 add 方法輕松計(jì)算出一周后的日期。

示例 2：跨時區(qū)時間處理

const nyTime = Temporal.ZonedDateTime.from({
 timeZone: 'America/New_York',
 year: 2024,
 month: 10,
 day: 20,
 hour: 12
})
const tokyoTime = nyTime.withTimeZone('Asia/ShangHai')
console.log(tokyoTime.toString()) // 輸出: 2024-10-21T00:00:00+08:00[Asia/Shanghai]

以上代碼把紐約時間轉(zhuǎn)化為北京時間（'Asia/ShangHai'）

示例 3：處理當(dāng)前時間點(diǎn)

const instant = Temporal.Instant.now();
console.log(instant.toString());  // 輸出: 2024-10-20T14:30:00.123456789Z

Instant 表示唯一的瞬時時間，特別適合用于日志記錄、時序數(shù)據(jù)等需要精確記錄時間點(diǎn)的場景。

4. Temporal 相比 Date 的優(yōu)勢

與傳統(tǒng)的 Date API 相比，Temporal 帶來了許多實(shí)質(zhì)性的改進(jìn)：

1. 不變性：所有操作返回新對象，避免了潛在的數(shù)據(jù)修改問題。
2. 精度提升：時間精度達(dá)到納秒級別，適用于高精度需求的場景。
3. 時區(qū)支持：內(nèi)置時區(qū)轉(zhuǎn)換功能，消除了手動處理時區(qū)的繁瑣操作。
4. 多日歷支持：內(nèi)置支持多種日歷系統(tǒng)，適應(yīng)全球化需求。
5. 更直觀的 API：Temporal API 設(shè)計(jì)更加直觀，日期時間的操作變得簡潔明了。

5. 如何在現(xiàn)有項(xiàng)目中使用 Temporal

因?yàn)?Temporal 是 TC39 的實(shí)驗(yàn)性 API（哪怕已經(jīng)很接近完善了），但是我們依然無法直接在瀏覽器中使用它。

如果想要使用，那么必須要配合 @js-temporal/polyfill 才可以

圖片

我們可以直接創(chuàng)建一個 node 項(xiàng)目，然后通過 npm i @js-temporal/polyfill 完成安裝，然后利用require 導(dǎo)入 Temporal 即可使用

圖片