Dateオブジェクト
Dateオブジェクトを使ったシンプルな日付操作
Dateオブジェクトは使いにくい?
TypeScript/JavaScriptの組み込みオブジェクトであるDateオブジェクトは、日付や時刻を扱うための基本的な機能を提供します。 しかし、そのAPIは直感的でない部分が多く、特にタイムゾーンの扱いや月のインデックスが0から始まる点など、初心者にとって混乱を招くことがあります。
実際の業務においてもDateオブジェクトの扱いに苦労することが多く、より使いやすい日付操作ライブラリ(例: date-fnsやdayjs)が広く利用されています。いえ、基本的にこれらのライブラリを使っている現場がほとんどでしょう。
しかし、そもそも日時操作自体が複雑であり、またライブラリを使う場合でもDateオブジェクトの基礎的な理解は重要です。 ここではDateオブジェクトを使ったシンプルな日付操作について解説します。
タイムゾーンの考え方
Dateオブジェクトを扱う上で最も悩まされるのはタイムゾーンの理解です。特にブラウザで動作するjavaScriptでは、Dateオブジェクトは常に実行環境のローカルタイムゾーンを基準に動作します。 すなわち、ユーザーのPCの設定によってDateオブジェクトの振る舞いが変わる可能性があります。
「うちのサイトは日本のユーザーが多いので問題にならない」……そう思うかもしれませんが、あるユーザーは海外からアクセスしているかもしれません。また、サーバーサイドで動作する場合も、サーバーのタイムゾーン設定によって結果が変わる可能性があります。 つまり、Dateオブジェクトを使う際は常にタイムゾーンの影響を考慮する必要があります。
では、どのように気を付ければよいのでしょうか?
実のところ、Dateオブジェクトの持つ日時の実態は1970年1月1日午前0時(UTC)からのミリ秒を表す整数値でしかありません。そしてこの整数値はタイムゾーンに依存しません。日本であってもアメリカであっても同じ値です。 ということは、Dateオブジェクトを生成する際に常にUTCとして扱うことで、タイムゾーンの影響を受けずに一貫した日時操作が可能になります。
タイムゾーンの扱い
上記のコード例では、現在日時を取得し、UTCとして扱うことで一貫した日時操作を行っています。 getTime()メソッドおよびtoISOString()メソッドはタイムゾーンに依存しないため、常に同じ結果が得られます。 特にtoISOString()メソッドは、UTC時刻をISO 8601形式の文字列で返すため、簡単な文字列操作で日付と時刻を分割して取り出したり、独自フォーマットで表示したりすることができます。
シンプルな時刻の操作
ではここで、Dateオブジェクトを使ってシンプルな時刻操作を行う例を見てみましょう。
指定された時刻に指定された分数を加算し、新しい時刻を表示するという処理について考えます。 分は0-59の範囲で、60分を超える場合は時間に繰り上げる必要があります。時間は0-23の範囲で、24時間を超える場合は日付に繰り上げる必要があります。 数値型で扱うには複雑ですね。しかしDateオブジェクトを使うと簡単に実装できます。
このサイトでは入力は文字列です。基準の時刻は"HH:MM"の形式で与えられると仮定します。文字列を時刻に変換するにも、ISO 8601形式の文字列を使うと簡単です。
時刻の加算
まとめ
TypeScript/JavaScriptにおけるDateオブジェクトの基本的な使い方や注意点について説明しました。特にタイムゾーンの扱いやシンプルな時刻操作の実装方法を理解できたかと思います。
日付操作ライブラリを使う場合でも、Dateオブジェクトの基礎的な理解は重要です。ぜひ、実務での日付操作に役立ててください。