JavaScriptの日付形式をマスターする！～JavaScript Dateオブジェクトの活用法～
1. JavaScriptと日付処理
JavaScriptは、Webページ上で動的な操作を行うためのプログラミング言語です。その多彩な機能の中には、日付や時間を扱うための「Dateオブジェクト」というものが存在します。
この記事では、JavaScriptのDateオブジェクトを用いた日付の比較方法を具体的なソースコードと共に紹介します。
KindleUnlimited会員であれば、全ての本をご覧頂けます。 アロー関数と便利な関数を理解すれば、JavaScriptの世界が変わる
2. Dateオブジェクトの作成
まずは、JavaScriptで日付を扱うために必要なDateオブジェクトの作成方法を見ていきましょう。
以下に、現在の日付と時刻を表すDateオブジェクトを作成するコードを示します。
ソースコード例: Dateオブジェクトの作成
|
1 2 |
let now = new Date(); console.log(now); |
出力結果
2023-05-23T12:34:56.789Z
3. Dateオブジェクトから年・月・日・時・分・秒を取得する
次に、Dateオブジェクトから具体的な年・月・日・時・分・秒を取得する方法を学びましょう。
以下に、それぞれの情報を取得するコードを示します。
ソースコード例: 年・月・日・時・分・秒の取得
|
1 2 3 4 5 6 7 8 |
let year = now.getFullYear(); let month = now.getMonth() + 1; let date = now.getDate(); let hours = now.getHours(); let minutes = now.getMinutes(); let seconds = now.getSeconds(); console.log(year, month, date, hours, minutes, seconds); |
出力結果
2023 5 23 12 34 56
4. Dateオブジェクトの比較
それでは本題の、Dateオブジェクト同士を比較する方法について説明します。
JavaScriptでは、Dateオブジェクト同士を直接比較することはできません。その代わり、Dateオブジェクトをミリ秒単位の数値に変換し、それらを比較します。
ソースコード例: Dateオブジェクトの比較
|
1 2 3 4 |
let date1 = new Date(2023, 4, 23); // 2023年5月23日 let date2 = new Date(2023, 4, 24); // 2023年5月24日 console.log(date1.getTime() < date2.getTime()); // date1がdate2よりも前かどうかを比較 |
出力結果
true
5. Dateオブジェクトの加減算
JavaScriptのDateオブジェクトでは、日付や時刻の加減算も行うことができます。
たとえば、ある日付から3日後の日付を求める場合は、以下のようにします。
ソースコード例: Dateオブジェクトの加算
|
1 2 3 4 |
let date3 =new Date(2023, 4, 23); // 2023年5月23日 date3.setDate(date3.getDate() + 3); // 3日後 console.log(date3); |
出力結果
2023-05-26T00:00:00.000Z
6. Dateオブジェクトと文字列の変換
JavaScriptのDateオブジェクトは、適切な形式の文字列に変換することも可能です。
この機能は、日付を人間が読みやすい形式で表示したり、日付をサーバーに送信する際に便利です。
ソースコード例: Dateオブジェクトを文字列に変換
|
1 2 |
let dateString = date3.toISOString(); console.log(dateString); |
出力結果
2023-05-26T00:00:00.000Z
7. JavaScriptで日付の差分を取得する
日付の比較だけではなく、JavaScriptでは日付の差分も簡単に取得することができます。
特に、日付の差分は計画を立てる時や、何かの期間を計算するときなど、様々なシチュエーションで活用できます。
ソースコード例: 日付の差分を取得する
|
1 2 3 4 5 6 7 |
let date1 = new Date(2023, 4, 23); // 2023年5月23日 let date2 = new Date(2023, 4, 26); // 2023年5月26日 let diff = date2.getTime() - date1.getTime(); // ミリ秒単位の差分を取得 let diffDays = diff / (1000 * 60 * 60 * 24); // 日単位に変換 console.log(diffDays); |
出力結果
3
8. JavaScriptで日付を"yyyy年mm月dd日"の形式にフォーマットする
JavaScriptのDateオブジェクトは強力ですが、出力される日付の形式は限定的です。
しかし、カスタムフォーマット（例えば"yyyy年mm月dd日"）で日付を表示したい場合もあるでしょう。そんなときは以下のようにしてください。
ソースコード例: 日付をカスタムフォーマットにする
|
1 2 3 4 5 6 7 8 9 |
let date = new Date(2023, 4, 23); // 2023年5月23日 let year = date.getFullYear(); let month = date.getMonth() + 1; // getMonth()は0から始まるので1を足す let day = date.getDate(); let formattedDate = year + "年" + month + "月" + day + "日"; console.log(formattedDate); |
出力結果
2023年5月23日
まとめ
今回は、JavaScriptのDateオブジェクトを活用した日付の比較方法について詳しく解説しました。
この記事を読んだあなたも、JavaScriptを用いて日付処理を自在に操ることができるでしょう。
最後まで読んで頂き、ありがとうございました。少しでもお役にたてたなら幸いです！
