君は新しい日付/時刻 API Temporal を知っ ているか？ 2024.06.28 Kyoto.js #22

id: @luccafort ● マネーフォワード@Tech PR ● 主にバックエンド主体、フロントエンドは ちょっと苦手 ● Kyoto.rb / Kyoto.go Organizer ● Go Conference 実行委員 ● EUROとコパ・アメリカで生活が破綻して ます ○ Abema TV & Amazon Prime Video 最高！ ○ DAZN……？知らんな ○ 時差問題がつらい ● I love football! ○ Manchester City ○ Inter Milano ● 最近プレイしている百英雄伝が楽し い

そもそも Temporal APIとは いったいなにものか？

● TC39 によって提案されているプロポーザルの1つ
 ○ 現在のステージは3、ステージ4になれば規格として受け入れ可能な状態になる（以降の変更はできな い）
 ○ TC39 はECMAScriptを策定している専門委員会（ Technical Commitee）のこと。
 ■ DartはTC52になる。
 ○ みんなが使用するためにはまだ polyfill が必要
 ■ α版リリース: https://www.npmjs.com/package/@js-temporal/polyfill
 ■ β版リリース: https://www.npmjs.com/package/temporal-polyfill
 ● リポジトリはこちら
 ○ https://github.com/tc39/proposal-temporal
 Temporal APIとは

Temporal APIとは “a global Object that acts as a top-level namespace (like Math), that brings a modern date/time API to the ECMAScript language. For a detailed look at some of the problems with Date, and the motivations for Temporal, see: Fixing JavaScript Date.” Temporal はグローバルオブジェクトであり、（Math のように）トップレベルの名前空間とし て機能します。Temporal はモダンな date/time API を ECMAScript にもたらします。Date の既存の問題点や Temporal を策定することへのモチベーションに関してはFixing JavaScript Dateを参照してください。 https://tc39.es/proposal-temporal/docs/index.html https://tc39.es/proposal-temporal/docs/ja/index.html

1. ユーザーのローカルタイムとUTC以外のタイムゾーンをサポート していない
 2. パーサーの動作は信頼性に欠け、使い物にならない
 3. 日付オブジェクトは変更可能
 4. サマータイムの動作は予測不可能
 5. 計算APIが扱いにくい
 6. グレゴリオ暦以外の暦をサポートしていない
 既存のDate APIの課題（嫌なもの順）

● 日付と時刻を操作する簡単で使いやすい API を提供 ● DST （Daylight Saving Time)を考慮した演算と、すべてのタイ ムゾーンをサポート ● オブジェクトは特定の日時や時刻を明確に表現 ● 厳格に定義された文字列をパース ● グレゴリオ暦以外のカレンダーをサポート
 Temporal APIが解決できること

Q. const date = new Date(2024, 12, 29) を実行したとき出力 されるのはどれ？ A. > Sun Dec 29 2024 00:00:00 GMT+0900 (Japan Standard Time) B. > Wed Jan 29 2025 00:00:00 GMT+0900 (Japan Standard Time) C. 出力できない 突然ですがここでクイズです

Q. const date = new Date(2024, 12, 29) を実行したとき出力 されるのはどれ？ A. > Sun Dec 29 2024 00:00:00 GMT+0900 (Japan Standard Time) B. > Wed Jan 29 2025 00:00:00 GMT+0900 (Japan Standard Time) C. 出力できない 突然ですがここでクイズです これが正解 JSのDateオブジェクトの月のインデック スは0から始まる

● 日付文字列のパースが実装依存 a. new Date('03-25-2017') の結果はブラウザの実装依存 b. 検証のためにSafari の Developer Consoleで試したら動いてしまった… ● 時間のみ、日付のみを扱えない a. 時間だけの比較や日付だけの比較をしたいことあるよね！ ● 期間を扱えない ● タイムゾーンの扱いが環境依存 ● グレゴリオ暦以外の暦を扱えない a. 中国暦やユダヤ暦では閏年は13ヶ月になるがDateでは表現できない 他にもDate APIにはいろいろな課題がある

DEMO ここに用意したものが あってな……？

Temporal の構造 https://tc39.es/proposal-temporal/docs/index.html#object-relationship

超雑に解説しちゃうと…… クラス名 説明 PlainXX 日時のみを持つ。UNIX時間やタイムゾーンの情報は持っていない ZonedDateTime UNIX時間とタイムゾーンを両方持ってる。Exact TimeとWall-Clock Timeの両方に属する Instant UNIX時間しか知らない。タイムゾーンを持ってないので、このクラス単体では日付や時間は得られな い。 Duration 時刻の加算・減算をするときなどに使う補助的なクラス。 TimeZone タイムゾーンを指定するときに使える。例えばIsntantからZonedDateTimeの変換をするときなど。 Calendar カレンダーシステムは、「特定の時刻」と「年、月、日といった人間が読みやすい数値」に対応する補助的 なクラス

No content

Deno 1.40 Released, Features Upcoming JavaScript’s Temporal API and Decorators
 Deno 1.40ではすでにTemporalが実装されている

まとめ

● Temporal APIはDate APIのイケてなかったところをうまく解決している
 ● クラスの構造や思想などソフトウェアアーキテクチャの勉強にもなった
 ● カレンダーサポートやDurationのバランスングなど読んでいて面白い！
 ○ Temporal におけるカレンダーシステムのサポート （個人的にイチオシ） ○ Duration のバランシング ● 日付/時間 関係でイラッとすることが減りそうで早くECMAScriptに実装されてほし い！
 ○ Date→Temporal や Temporal→Date の変換もできる、便利〜〜〜！ 
 ○ 今回話さなかったけど期間（ Duration）やカレンダーは実務でも絶対使う（はず） 
 ○ いますぐ触りたい方は polyfill を使って触ってみるか Deno 1.40+ で遊んでみよう！
 まとめ

Road to SRE NEXT@京都 https://sre-lounge.connpass.co m/event/318844/

https://hrmos.co/pages/moneyforward/jobs/0004191

Ref(順不同): ● tc39/proposal-temporal ● MDN Web Docs / Date ● Duration のバランシング ● Temporal におけるカレンダーシステムのサポート ● Deno 1.40: Temporal API ● "Deno 1.40"がリリース、JavaScriptのTemporal APIとデコレーターの新機能を搭載 ● Fixing JavaScript Date ● ECMAScriptとは何か？ ○ TC39 ○ TC39 Process: Stage ● JavaScriptの新しい標準日付ライブラリ Temporalまとめ ● Temporal: JavaScript で"時間"を扱う際の使用方法（と個室ブース予約サイトでの活用例） ● date() function returning Invalid Date in Safari and Firefox ● JS の Date で任意のタイムゾーンを表現するのは難しい ● JavaScriptの組み込みAPIのIntlが凄いので紹介してみた。 ● Temporal入門 ○ その1 ～ Temporalクラスの使い分けと相互変換について ○ その2 ～ 実際に日付と時刻を操作してみる ○ その3 ～ Temporalオブジェクトと文字列の変換（フォーマット等） ● Temporal で JavaScript の次世代の日時処理に触れてみる

No content