JavaScriptの日時操作でよくあるエラーとその解決方法!初心者向けガイド
生徒
「JavaScriptで日付を扱っていると、なぜか意図した日時と違う表示になることがあります。これはどうしてですか?」
先生
「それはよくあるエラーです。日時操作での誤りは、タイムゾーンや月のインデックス、文字列のフォーマットの違いが原因になっていることが多いです。」
生徒
「具体的にどんな間違いが起こるんですか?」
先生
「順番に見ていきましょう。エラーの種類とその解決方法を整理しておくと安心です。」
1. 月のインデックスの勘違い
JavaScriptのDateオブジェクトでは、月は0から始まります。つまり1月は0、12月は11です。初心者は「11月は11」と覚えがちですが、実際には11月は10になります。
// 誤り例
const date = new Date(2025, 11, 18); // 11月ではなく12月になる
console.log(date.toString());
// 修正例
const correctDate = new Date(2025, 10, 18); // 10が11月
console.log(correctDate.toString());
Wed Dec 18 2025 00:00:00 GMT+0900 (日本標準時)
Tue Nov 18 2025 00:00:00 GMT+0900 (日本標準時)
月の数え方を間違えると、意図しない月が表示されるので注意が必要です。
2. タイムゾーンによる誤差
JavaScriptのDateは内部的にはUTC(協定世界時)で保持され、画面に表示するときにローカルタイムに変換されます。そのため、異なるタイムゾーンで確認すると時間がずれることがあります。
const utcDate = new Date(Date.UTC(2025, 10, 18, 15, 0, 0));
console.log("UTC表示:", utcDate.toUTCString());
console.log("ローカル表示:", utcDate.toString());
UTC表示: Tue, 18 Nov 2025 15:00:00 GMT
ローカル表示: Tue Nov 18 2025 24:00:00 GMT+0900 (日本標準時)
タイムゾーン差を意識して、toUTCString()やtoLocaleString()を活用しましょう。
3. 無効な日付(Invalid Date)の生成
不正な値を渡すと、Invalid Dateが返ってきます。例えば月が13や日が32などです。
// 無効な日付
const invalidDate = new Date(2025, 12, 32);
console.log(invalidDate.toString());
// 有効に修正
const validDate = new Date(2025, 11, 31);
console.log(validDate.toString());
Invalid Date
Wed Dec 31 2025 00:00:00 GMT+0900 (日本標準時)
必ず正しい範囲の値を設定しましょう。
4. 文字列からのDate生成の注意点
文字列からDateを作ると、ブラウザによって解釈が異なることがあります。ISO形式(YYYY-MM-DDTHH:mm:ss)で渡すのが安全です。
// NG: ブラウザ依存
const strDate = new Date("11/18/2025 10:00:00");
console.log(strDate.toString());
// OK: ISO形式
const isoDate = new Date("2025-11-18T10:00:00Z");
console.log(isoDate.toUTCString());
Tue Nov 18 2025 19:00:00 GMT+0900 (日本標準時)
Tue, 18 Nov 2025 10:00:00 GMT
ISO形式を使うことで、どのブラウザでも安定して日時を扱えます。
5. 日時演算の注意点
加算や減算を行うときに、月末やうるう年を意識せずに計算すると誤差が出ます。setDate()やsetMonth()を使うと、自動で調整してくれます。
// 31日から1日加算
const d = new Date(2025, 0, 31);
d.setDate(d.getDate() + 1);
console.log(d.toString()); // 自動で2月1日になる
Sat Feb 01 2025 00:00:00 GMT+0900 (日本標準時)
こうした便利なメソッドを使うことで、手動で計算するよりも安全に日時操作が可能です。
6. まとめ的なポイント
- 月は0から始まることを意識する
- タイムゾーン差を考慮して
toUTCString()やtoLocaleString()を使用する - 文字列から日付を作る場合はISO形式を使う
- 加算・減算は
setDate()やsetMonth()で安全に行う - Invalid Dateを作らないように正しい値を設定する