1. 導入：なぜDate.prototype.valueOfが重要なのか
JavaScriptで日付を扱う際、「2つの日付のどちらが新しいか比較したい」「日付同士の差分を計算したい」といった場面は頻繁に発生します。しかし、Dateオブジェクト同士を直接比較演算子（> や <）で比較しようとして、意図しない挙動に悩んだことはありませんか？ Date.prototype.valueOfは、こうした日付の比較や計算を裏側で支えている非常に重要なメソッドです。この仕組みを理解することで、バグを未然に防ぎ、簡潔で読みやすいコードを書けるようになります。
2. 基礎知識：valueOfとは何か
JavaScriptのオブジェクトは、数値として扱われる際に自動的にvalueOfメソッドを呼び出してプリミティブ値（数値）に変換しようとします。
DateオブジェクトにおけるvalueOfメソッドは、その日時を「1970年1月1日 00:00:00 UTC」からの経過ミリ秒数（UNIXタイムスタンプ）として返します。つまり、Dateオブジェクトを数値として扱うと、自動的にこのメソッドが実行され、数値同士の比較が可能になるのです。
3. 実装/解決策：比較と計算のコツ
Dateオブジェクトを直接比較演算子で比較した場合、内部的にvalueOfが呼ばれるため、見た目上は正しく比較できているように見えます。しかし、厳密な等価比較（===）や、より安全な計算を行いたい場合は、明示的にvalueOf()やgetTime()を使用するのがフロントエンド開発の現場におけるベストプラクティスです。
4. サンプルプログラム
以下のコードで、Dateオブジェクトがどのように数値に変換され、比較に利用されるかを確認してみましょう。
// 現在の日時と、1時間後の日時を作成
const now = new Date();
const oneHourLater = new Date(now.getTime() + (60 60 1000));
// 1. valueOfを使ってミリ秒を取得
const nowMs = now.valueOf();
const laterMs = oneHourLater.valueOf();
console.log(`現在時刻のミリ秒: ${nowMs}`);
console.log(`1時間後のミリ秒: ${laterMs}`);
// 2. 日付の比較（valueOfのおかげで数値比較が可能）
if (oneHourLater > now) {
console.log("1時間後のほうが未来です");
}
// 3. 差分計算（ミリ秒から時間単位へ変換）
const diffInHours = (oneHourLater - now) / (1000 60 60);
console.log(`差分は ${diffInHours} 時間です`);
5. 応用・注意点：現場で役立つアドバイス
現場で注意すべき点として、「Dateオブジェクト同士の等価比較（===）」があります。
`date1 === date2` は、たとえ日時が同じであっても、オブジェクトの参照先が異なるため必ず `false` になります。日付の「中身」が等しいかを判定したい場合は、必ず以下のようにvalueOfやgetTimeメソッドを使って数値として比較してください。
NG: if (date1 === date2) { … }
OK: if (date1.valueOf() === date2.valueOf()) { … }
また、最近のプロジェクトでは、日付操作に `Date-fns` や `Day.js` といったライブラリを使うことも多いですが、ライブラリの内部でも最終的にはこのvalueOfの仕組みが基礎として使われています。基本を理解しておくことで、ライブラリがうまく動かない際のデバッグ能力も格段に向上しますよ。