JavaScriptのDateで日付の作成・変換・比較する方法を総まとめ

JavaScript

JavaScriptのDateとは

JavaScriptでは、日、月、年、時、分、秒、ミリ秒などの日付と時刻を扱うためのDateオブジェクトが用意されています。

JavaScriptで現在の日付と時刻の文字列表現を得るには、Date()関数を使用します。また、Dateオブジェクトを取得するには、newキーワードを使用します。

Date(); //現在日時の文字列を返す

//もしくは

let currentDate = new Date(); //現在日時のDateオブジェクトを返す

Date()コンストラクタ関数にさまざまなパラメータを指定して、日付オブジェクトを作成します。

new Date()
new Date(value)
new Date(dateString)
new Date(year, monthIndex)
new Date(year, monthIndex, day)
new Date(year, monthIndex, day, hours)
new Date(year, monthIndex, day, hours, minutes)
new Date(year, monthIndex, day, hours, minutes, seconds)
new Date(year, monthIndex, day, hours, minutes, seconds, milliseconds)

引数の種類について

  • 引数なし:コンストラクタにパラメータが指定されていない場合、日付オブジェクトには現在の日付と時刻が設定されます。
  • value:1970年1月1日 00:00:00 UTC からのミリ秒を表す整数値です。
  • dateString:Date.parse() メソッドを用いてパースされる文字列値。
  • year:日付の年を表す整数値。0 から 99 までの数値は 1900 年から 1999 年までと対応する。それ以外は実年齢となります。
  • monthIndex:日付の月を表す整数値。1 月を表す 0 から始まり、12 月を表す 11 まである。
  • day:その月の曜日を表す整数値。
  • hours:0 から 23 までの整数値で、その日の時間を表す。
  • minutes:時間区分の「分」を表す整数値。
  • seconds:秒を表す整数値。
  • milliseconds:時間セグメントのミリ秒を表す整数値。コンストラクタでミリ秒を数値で指定すると、1970年1月1日からの経過日時が取得できます。

以下のコード例では、Date()コンストラクタ関数にミリ秒を渡して、日付オブジェクトを作成しています。つまり、1970年1月1日からの経過ミリ秒をもとに日付が計算されるということです。

let date1 = new Date(0);    // Thu Jan 01 1970 09:00:00 GMT+0900
let date2 = new Date(1000); // Thu Jan 01 1970 09:00:01 GMT+0900
let date3 = new Date(2000); // Thu Jan 01 1970 09:00:02 GMT+0900

以下のコード例は、Date() コンストラクタで指定できる日付文字列のさまざまな書式を示しています。

let date1 = new Date("5 march 2020");
let date2 = new Date("5 February, 2020");
let date3 = new Date("5th February, 2020"); // invalid date
let date4 = new Date("2020 5 February");
let date5 = new Date("5 2020 February ");
let date6 = new Date("February 5 2020");
let date7 = new Date("February 2020 5");
let date8 = new Date("2 5 2020");
let date9 = new Date("5 march 2020 20:21:44");

日付セグメントを区別するために、日付文字列の有効なセパレータを使用することができます。

let date1 = new Date("February 2020-5");
let date2 = new Date("February-2020-5");
let date3 = new Date("February-2020-5");
let date4 = new Date("February,2020-5");
let date5 = new Date("February,2020,5");
let date6 = new Date("February*2020,5");
let date7 = new Date("February$2020$5");
let date8 = new Date("5-2-2020"); // MM-dd-YYYY
let date9 = new Date("5/2/2020"); // MM-dd-YYYY

7つの数値を指定し、指定された年、月、そしてオプションとして日付、時、分、秒、ミリ秒を持つ日付オブジェクトを作成する。

let date1 = new Date(2020, 2, 3); // Mon Feb 03 2020 
let date2 = new Date(2020, 2, 3, 10); // Mon Feb 03 2020 10:00 
let date3 = new Date(2020, 2, 3, 10, 30); // Mon Feb 03 2020 10:30 
let date4 = new Date(2020, 2, 3, 10, 30, 50); // Mon Feb 03 2020 10:30:50 
let date5 = new Date(2020, 2, 3, 10, 30, 50, 800); // Mon Feb 03 2020 10:30:50

日付の書式(Date Format)

JavaScript は ISO 8601 日付形式をデフォルトでサポートしています – YYYY-MM-DDTHH:mm:ss.sssZ

let date = new Date('2020-02-10T10:12:50.5000z');

日付の書式を変換する

異なる日付メソッドを使用して、あるフォーマットから別のフォーマットに日付を変換します (例: 標準時、グリニッジ標準時、現地時間フォーマット)。

以下の例では、ToUTCString()ToGMTString()ToLocalDateString()ToTimeString()メソッドを用いて、日付をそれぞれの形式に変換する方法を示しています。

let date = new Date('2020-02-10T10:12:50.5000z');

date; // Mon Feb 10 2020 19:12:50 GMT+0900

date.toDateString(); // 'Mon Feb 10 2020'

date.toLocaleDateString(); // '2/10/2020'

date.toGMTString(); // 'Mon, 10 Feb 2020 10:12:50 GMT'

date.toISOString(); // '2020-02-10T10:12:50.500Z' 

date.toLocaleString(); // '2020/2/10 19:12:50'

date.toLocaleTimeString(); // '19:12:50'

date.toString('YYYY-MM-dd'); // 'Mon Feb 10 2020 19:12:50'

date.toTimeString(); // '19:12:50 GMT+0900' 

date.toUTCString(); // 'Mon, 10 Feb 2020 10:12:50 GMT' 

上記以外の形式の日付文字列を取得するには、別の日付オブジェクトのメソッドを使用して手動で日付文字列を形成する必要があります。

以下は、日付文字列をDD-MM-YYYYフォーマットに変換するコード例です。

let date = new Date('5-1-2020'); // M-D-YYYY

let d = date.getDate();
let m = date.getMonth() + 1;
let y = date.getFullYear();

let dateString = (d <= 9 ? '0' + d : d) + '-' + (m <= 9 ? '0' + m : m) + '-' + y;

JavaScriptでの日付の比較をする方法

以下は比較演算子を使って、2つの日付オブジェクトを比較するコード例です。

let date1 = new Date('5-1-2020');
let date2 = new Date('5-2-2020');

if (date1 > date2) {
  alert(date1 + ' is greater than ' + date2);
}
else (date1 < date2 ) {
  alert(date1 + ' is less than ' + date2);
}
タイトルとURLをコピーしました