JavaScript Dateオブジェクトの使い方（Date）｜VB.NET-TIPS などプログラミングについて

2020/05/11

JavaScript には日付用のデータ型がありませんが、その代わりとして Dateオブジェクト が存在します。
この Dateオブジェクト は日付の設定、取得、操作を行うためのメソッドを持っていますのでそれをプログラムから利用できます。尚 Dateオブジェクト にはプロパティがありません。

Dateオブジェクト はUnixタイムスタンプが 1970年1月1日 00:00:00 からの秒の数値であるのと同様に、ミリ秒の数値で日付を格納しています。

■Dateオブジェクトのコンストラクタについて

// 年,月,日,時,分,秒,ミリ秒 を個別に指定
objDate = new Date(yead, month [, day [, hour [, min [, sec [, milisec] ] ] ] ]);
// Unix Time を指定(1970/01/01 00:00:00)からの時間をミリ秒単位で指定
objDate = new Date(unixtime);
// 文字列で時刻を指定
objDate = new Date(string);
// 引数無しは現在時刻
objDate = new Date();

上記の4種類の Dateオブジェクト の生成方法があります。それぞれの例を順次以下に示します。

■年,月,日,時,分,秒,ミリ秒を個別に指定

    objDate = new Date(2020, 4);
    console.log(objDate);
    objDate = new Date(2020, 4, 10);
    console.log(objDate);
    objDate = new Date(2020, 4, 10, 13);
    console.log(objDate);
    objDate = new Date(2020, 4, 10, 13, 59);
    console.log(objDate);
    objDate = new Date(2020, 4, 10, 13, 59, 59);
    console.log(objDate);
    objDate = new Date(2020, 4, 10, 13, 59, 59, 150);
    console.log(objDate);

ブラウザの開発環境のコンソールを見ると以下の様になります。（この表示はFirefoxです）
尚、月の指定は 1月～12月が 0 ～ 11 で設定しますので注意が必要です。

Date Fri May 01 2020 00:00:00 GMT+0900 (日本標準時)
Date Sun May 10 2020 00:00:00 GMT+0900 (日本標準時)
Date Sun May 10 2020 13:00:00 GMT+0900 (日本標準時)
Date Sun May 10 2020 13:59:00 GMT+0900 (日本標準時)
Date Sun May 10 2020 13:59:59 GMT+0900 (日本標準時)
Date Sun May 10 2020 13:59:59 GMT+0900 (日本標準時)

■Unix Time を指定(1970/01/01 00:00:00)からの時間をミリ秒単位で指定

    // 1日のミリ秒
    var dateMilisec = 24 * 60 * 60 * 1000;
    // 2020年1月1日までのミリ秒
    var allMilisec = 50 * 365 * dateMilisec + 12 * dateMilisec;
    // Dateオブジェクト
    var objDate = new Date(allMilisec);
    console.log(objDate);

ブラウザの開発環境のコンソールを見ると以下の様になります。（この表示はFirefoxです）

Date Wed Jan 01 2020 09:00:00 GMT+0900 (日本標準時)

■文字列で時刻を指定

    var objDate;

    objDate = new Date("2020-05-08T13:59:59");
    console.log(objDate);
    objDate = new Date("2020/05/08 13:59:59");
    console.log(objDate);
    objDate = new Date("05/08/2020 23:59:59");
    console.log(objDate);

ブラウザの開発環境のコンソールを見ると以下の様になります。（この表示はFirefoxです）

Date Fri May 08 2020 13:59:59 GMT+0900 (日本標準時)
Date Fri May 08 2020 13:59:59 GMT+0900 (日本標準時)
Date Fri May 08 2020 23:59:59 GMT+0900 (日本標準時)

■引数無しは現在時刻

    // 引数無し
    var objDate = new Date();
    console.log(objDate);

ブラウザの開発環境のコンソールを見ると以下の様になります。（この表示はFirefoxです）
尚、この実行は 2020年5月11日に行いました。

Date Mon May 11 2020 16:41:40 GMT+0900 (日本標準時)

■Dateオブジェクトのメソッドについて

Dateオブジェクト のメソッドは下記の接頭語の付いたものが在りそれぞれに分類されます。

■「get」メソッド:Dateオブジェクトの日時等の取得メソッド

    // Dateオブジェクト
    var objDate = new Date(2020, 5, 10, 13, 59, 50, 150);
    var str = "";
    str += objDate.getFullYear();           // 年(1900 年以降の年)
    str += "/" + (objDate.getMonth() + 1);  // 月(0 〜 11 )
    str += "/" + objDate.getDate();         // 日(1 〜 31 )
    str += " " + objDate.getHours();        // 時(0 〜 23)
    str += ":" + objDate.getMinutes();      // 分(0 〜 59)
    str += ":" + objDate.getSeconds();      // 秒(0 〜 59)
    str += "." + objDate.getMilliseconds(); // ミリ秒(0 〜 999)
    console.log(str);

ブラウザの開発環境のコンソールを見ると以下の様になります。

2020/5/10 13:59:50.150

尚、月日時分秒に先頭ゼロを付加する場合は以下の様にします。

    // 2020/05/08 09:05:06.050 の設定
    objDate = new Date(2020, 4, 8, 9, 5, 6, 50);
    str = "";
    str += objDate.getFullYear();                               // 年(1900 年以降の年)
    str += "/" ('0' + (objDate.getMonth() + 1)).substr(-2);     // 月(0 〜 11 )
    str += "/" ('0' + objDate.getDate()).substr(-2);            // 日(1 〜 31 )
    str += " " ('0' + objDate.getHours()).substr(-2);           // 時(0 〜 23)
    str += ":" ('0' + objDate.getMinutes()).substr(-2);         // 分(0 〜 59)
    str += ":" ('0' + objDate.getSeconds()).substr(-2);         // 秒(0 〜 59)
    str += "." ('00' + objDate.getMilliseconds()).substr(-3);   // ミリ秒(0 〜 999)
    console.log(str);

ブラウザの開発環境のコンソールを見ると以下の様になります。

2020/05/08 09:05:06.050

■「set」メソッド:Dateオブジェクトへ日時等の設定メソッド

    var objDate = new Date();       // オブジェクト生成(現在時)
    objDate.setFullYear(2020);      // 年
    objDate.setMonth(3);            // 月
    objDate.setDate(30);            // 日
    objDate.setHours(13);           // 時
    objDate.setMinutes(59);         // 分
    objDate.setSeconds(49);         // 秒
    objDate.setMilliseconds(123);   // ミリ秒
    console.log(objDate);

ブラウザの開発環境のコンソールを見ると以下の様になります。

Date Thu Apr 30 2020 13:59:49 GMT+0900 (日本標準時)

この例では 4月30日の設定ですが setDate で 31日を設定すると結果は 5月1日になります。該当する月の日付の範囲を超えた場合は翌月、前月への調整が行われます。

    var objDate = new Date();       // オブジェクト生成(現在時)
    objDate.setFullYear(2020);      // 年
    objDate.setMonth(3);            // 月
    objDate.setDate(31);            // 日(あり得ない 4月31日 設定)
    console.log(objDate);           // オブジェクト内の月は、5月に調整される

    objDate.setDate(0);             // 日(あり得ない 5月0日 設定)
    console.log(objDate);           // オブジェクト内の月は、4月に調整される

    objDate.setFullYear(2020);      // 年
    objDate.setDate(-1);            // 日(あり得ない 4月-1日 設定)
    console.log(objDate);

ブラウザの開発環境のコンソールを見ると以下の様になります。

Date Fri May 01 2020 18:08:01 GMT+0900 (日本標準時)
Date Thu Apr 30 2020 18:08:01 GMT+0900 (日本標準時)
Date Mon Mar 30 2020 18:08:01 GMT+0900 (日本標準時)

setDate() の値が「0」の場合はオブジェクト内の月の1日から見て「-1」した日付になります。（これを使うと月の最終日を求めることが出来ます。）
また、setDate() の値が「-1」の場合はオブジェクト内の月の1日から見て「-2」した日付になります。
尚、このことはsetHours() , setMinutes() , setSeconds() においても指定値の範囲を超えた場合は日付のオブジェクト内を調整されます。

■「to」メソッド:Dateオブジェクトから文字列変換メソッド

    var objDate = new Date("2020/05/08 13:59:59");
    console.log( objDate.toString() );
    console.log( objDate.toDateString() );
    console.log( objDate.toTimeString() );

ブラウザの開発環境のコンソールを見ると以下の様になります。

Fri May 08 2020 13:59:59 GMT+0900 (日本標準時)
Fri May 08 2020
13:59:59 GMT+0900 (日本標準時)

■Dateオブジェクトの使用上の注意点

Dateオブジェクト を使用する時に注意する点があります。それはオブジェクトのコピーを作る時です。以下の例を見て下さい。

    // Dateオブジェクトの生成
    var date1 = new Date("2020/05/08");
    // Dateオブジェクトのコピー
    var date2 = date1;
    // コピー先での月を「2月」に設定
    date2.setMonth(1);
    console.log("date1 : " + date1);
    console.log("date2 : " + date2);

ブラウザの開発環境のコンソールを見ると以下の様になります。
1行目は「date1」の表示なので「5月(May)」と表示されそうなものですが「date2」と同じものが表示されます。

date1 : Sat Feb 08 2020 00:00:00 GMT+0900 (日本標準時)
date2 : Sat Feb 08 2020 00:00:00 GMT+0900 (日本標準時)

この原因はソースの4行目にあります。
「date1」を「date2」にコピーしている様に見えますが、実際 Dateオブジェクト はクラスのため参照がコピーされているからです。このコピーで「date1」「date2」ともに Dateオブジェクト の実体(インスタンス)は同じところを指しています。
それで「date2」で「setMonth」を行って「date1」からデータを見ても同じものになります。

結果、クラスデータを別の変数にコピーしたい場合は（コピーの様なもの）、既に存在しているオブジェクトの値で、別の変数に対して生成します。上記のソースを変更します。

    // Dateオブジェクトの生成
    var date1 = new Date("2020/05/08");
    // 最初のオブジェクト値で、別のDateオブジェクトの生成
    var date2 = new Date(date1.getTime());
    // コピー先での月を「2月」に設定
    date2.setMonth(1);
    console.log("date1 : " + date1);
    console.log("date2 : " + date2);

結果は正しく異なる日付になっています。

date1 : Fri May 08 2020 00:00:00 GMT+0900 (日本標準時)
date2 : Sat Feb 08 2020 00:00:00 GMT+0900 (日本標準時)

※クラスのオブジェクトを扱う場合はコピーをする場合は注意が必要です。

JavaScript
0CM

コメントを書く

■Dateオブジェクトのコンストラクタについて

■年,月,日,時,分,秒,ミリ秒 を個別に指定

■Unix Time を指定(1970/01/01 00:00:00)からの時間をミリ秒単位で指定

■文字列で時刻を指定

■引数無しは現在時刻

■Dateオブジェクトのメソッドについて

■「get」メソッド:Dateオブジェクトの日時等の取得メソッド

■「set」メソッド:Dateオブジェクトへ日時等の設定メソッド

■「to」メソッド:Dateオブジェクトから文字列変換メソッド

■Dateオブジェクトの使用上の注意点

コメント

■年,月,日,時,分,秒,ミリ秒を個別に指定