JavaScriptの「Day.js」ライブラリで日付の比較を行う方法

JavaScriptの日時・時刻用ライブラリ「Day.js」を用いて日付の比較を行いたかった。具体的には「開始日時」「終了日時」のようなテキストボックスが2つあり、「開始日時」が「終了日時」を超えている場合はNGとしたい。調べたところプラグインを追加すれば実装できるみたい。以下に実装方法をメモ。

CDN

CDNで使う場合は以下を記述する。「isSameOrBefore.min.js」が今回追加するプラグインになる。

<script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.11.13/dayjs.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.11.13/plugin/isSameOrBefore.min.js"></script>

異なるバージョンを利用したい場合は以下から探す。

https://cdnjs.com/libraries/dayjs

実装方法

ソースコード

//プラグイン読み込み
dayjs.extend(dayjs_plugin_isSameOrBefore);

const date_1 = dayjs('2025-08-01 00:00:00');
const date_2 = dayjs('2025-08-31 00:00:00');

//2025-08-01は2025-08-31より過去かどうか
console.log(date_1.isBefore(date_2)); //true

//2025-08-31は2025-08-01より過去かどうか
console.log(date_2.isBefore(date_1)); //false

注意点

isBeforeの場合、同一日時を比較するとfalseが返ってくる。

同一日時選択時は別のエラーメッセージなんかを出したい場合は「if( date_1 == date_2 )」のような形で記述すること。

その他

Day.jsの基本的な使い方は過去記事を参照すること。