導入
フロントエンド開発において、APIとの通信やローカルストレージへの保存など、日付データを扱う場面は非常に多いです。その際、日付をどのような形式で扱うかは非常に重要です。Date.prototype.toISOStringメソッドは、JavaScriptの日付オブジェクトを「ISO 8601形式(UTC)」の文字列に変換するための標準的な手段です。なぜこれを使うべきなのか、それは日時データに「タイムゾーンの曖昧さ」を排除し、システム間で共通のフォーマットとしてやり取りするためです。
基礎知識
ISO 8601形式とは、「YYYY-MM-DDTHH:mm:ss.sssZ」という形式で表される国際規格です。
・YYYY-MM-DD:年、月、日
・T:日付と時刻を区切るセパレータ
・HH:mm:ss.sss:時、分、秒、ミリ秒
・Z:Zuluタイム(UTC/協定世界時)であることを示す接尾辞
JavaScriptのDateオブジェクトは内部的にミリ秒単位の数値を保持していますが、そのままではJSON形式でシリアライズしにくいため、このメソッドで文字列化することで、バックエンドとのやり取りをスムーズにします。
実装/解決策
toISOStringは、Dateオブジェクトのメソッドとして直接呼び出すだけです。注意点として、このメソッドは常にUTC基準で時刻を生成します。日本時間(JST)で保存したい場合でも、標準的なAPI通信ではUTCに変換して送るのがベストプラクティスです。サーバー側でタイムゾーンを考慮した変換を行うのが、開発における一般的な責務分担となります。
サンプルプログラム
以下のコードをコピーして、ブラウザのコンソールで実行してみてください。現在時刻をISO形式に変換し、JSONとして出力するまでの流れを確認できます。
// 現在の時刻を取得
const now = new Date();
// ISO形式に変換
const isoString = now.toISOString();
console.log(“変換後のISO文字列:”, isoString);
// APIリクエストのペイロードを作成する例
const payload = {
id: 1,
createdAt: isoString, // サーバーへ送信する際はISO形式が推奨
status: “active”
};
console.log(“JSONへ変換して送信準備完了:”, JSON.stringify(payload));
// もし「Z」を取り除いてローカル時刻として扱いたい場合の注意点
// ※基本はISO形式のまま扱うことを推奨しますが、表示用などの加工例です
const displayTime = isoString.replace(“T”, ” “).split(“.”)[0];
console.log(“表示用フォーマット:”, displayTime);
応用・注意点
現場でよくある失敗として、「ブラウザのローカルタイムとISO変換後の時刻のズレ」が挙げられます。toISOStringは強制的にUTCへ変換するため、例えば日本時間(JST)の2023年10月1日 09:00は、ISO変換すると2023年10月1日 00:00:00Zとなります。
回避策:日付の計算や表示変換には、可能な限り「date-fns」や「Day.js」のような軽量ライブラリを併用することをお勧めします。これらを使えば、ISO文字列から任意のタイムゾーンやフォーマットへの変換が安全に行えます。また、DBに保存する際は、常にUTCで保存し、フロントエンド側で表示する直前にローカルタイムへ変換するという「データの正規化」を意識してください。