この記事では、JavaScript の Date オブジェクトについて詳しく解説します。
Date オブジェクトとは
Date オブジェクトは、JavaScript で用意されているオブジェクトの一つです。
JavaScript にはいろいろなオブジェクトが用意されていますが、その中でも Date オブジェクトは日付や時刻を扱うことを目的としたオブジェクトになります。
new Date()を使用して、インスタンス化することで協定世界時(UTC)である 1970 年 1 月 1 日 0 時 0 分 0 秒が基準となるオブジェクトを作成することができます。
new Date()で返ってきた値+いろいろなメソッドを使用することで年月等を表示できたりするようになります。
また、new Date()が代表的なインスタンス化の書き方ですが、インスタンス化には以下のような種類があります。
- new Date()
- new Date(日にち)
- new Date(ミリ秒)
- new Date(年, 月, 日, 時, 分, 秒, ミリ秒)
それぞれについて見ていきましょう。
new Date()
引数を指定しない場合は現在日時でオブジェクトが生成されます。
let now = new Date();
console.log(now); // Wed Nov 22 2023 11:29:04 GMT+0900 (日本標準時)普通のブラウザでは、タイムゾーンや滞在地域の情報が設定されているため、実行環境のタイムゾーンによって得られる値が異なる場合があります。
new Date(日にち)
引数に文字列で日にちを渡すと、渡した日付ののオブジェクトが生成されます。
渡す日にちのフォーマットは厳密には決まってません。
// 年月日を表す文字列
let date1 = new Date("2023/11/22");
let date2 = new Date("11/22/23");
console.log(date1); // Wed Nov 22 2023 00:00:00 GMT+0900 (日本標準時)
console.log(date2); // Wed Nov 22 2023 00:00:00 GMT+0900 (日本標準時)
// 年月日＋時刻を表す文字列
let date3 = new Date("2023-11-22T13:30:00");
let date4 = new Date("November 22, 2023 13:30:00");
console.log(date_3); // Wed Nov 22 2023 13:30:00 GMT+0900 (日本標準時)
console.log(date_4); // Wed Nov 22 2023 13:30:00 GMT+0900 (日本標準時)new Date(ミリ秒)
引数に基準日から経過したミリ秒を渡すと、基準日から渡したミリ秒分経過した日時のオブジェクトが生成されます。
// Thu Jan 01 1970 00:00:00 UTC+0を意味する
let date = new Date(0);
console.log(date); // Thu Jan 01 1970 09:00:00 GMT+0900 (日本標準時)new Date(年, 月, 日, 時, 分, 秒, ミリ秒)
引数にそれぞれの情報を渡すと、そのブラウザのタイムゾーンにおける時刻を取得します。
それぞれの引数には、以下のような決まりがあります。
- 年：4 桁表記で必ず指定
- 月：0(1 月)〜11(12 月)で必ず指定
- 日：指定がなければデフォルトで 1 となる
- 時・分・秒・ミリ秒：指定がなければデフォルトで 0 となる
以下 2 つは引数が別の内容でインスタンス化されていますが、取得される結果は全く同じものとなります。
let date5 = new Date(2023, 0, 1, 0, 0, 0, 0); // Sun Jan 01 2023 00:00:00 GMT+0900 (日本標準時)
let date6 = new Date(2023, 0); // Sun Jan 01 2023 00:00:00 GMT+0900 (日本標準時)例えば、以下のように引数を設定すると 2023 年 11 月 22 日、13 時 50 分 10 秒を取得することができます。
let date7 = new Date(2023, 10, 22, 13, 50, 10, 0); // Wed Nov 22 2023 13:50:10 GMT+0900 (日本標準時)Date オブジェクトの代表的なメソッド
次に代表的なメソッドについて見てみましょう。
代表的なメソッドには以下があります。
- getFullYear()
- getMonth()
- getDate()
- getDay()
- getHours()
- getMinutes()
- getSeconds()
- getMilliseconds()
詳しくみていきましょう。
getFullYear()
getFullYear()は年の取得をする際に使用します。
let year = new Date().getFullYear();
console.log(year); // 2023値は 4 桁の数字で返ってきます。（年数は増えていく一方なので、5 桁や 6 桁が返ってくるようになるかもしれません）
getMonth()
getMonth()は月の取得をする際に使用します。
let month = new Date().getMonth();
console.log(month); // 10値は 0 から 11 の数値が返ってきます。
2023 年 11 月 22 日にスクリプトを試していますが、new Date(年, 月, 日, 時, 分, 秒, ミリ秒)の説明時の月のルールで返ってくる値は 10 となります。
getDate()
getDate()は日にちの取得をする際に使用します。
let day = new Date().getDate();
console.log(day); // 22値は 1 から 31 の数値が返ってきます。
getDay()
getDate()は曜日の取得をする際に使用します。
let day_of_week = new Date().getDay();
console.log(day_of_week); // 3値は 0 から 6 の数値が返ってきます。
- 0：日曜日
- 1：月曜日
- 2：火曜日
- 3：水曜日
- 4：木曜日
- 5：金曜日
- 6：土曜日
getHours()
getHours()は時の取得をする際に使用します。
let hour = new Date().getHours();
console.log(hour); // 14値は 0 から 23 の数値が返ってきます。
getMinutes()
getMinutes()は分の取得をする際に使用します。
let minutes = new Date().getMinutes();
console.log(minutes); // 53値は 0 から 59 の数値が返ってきます。
getSeconds()
getSeconds()は秒の取得をする際に使用します。
let seconds = new Date().getSeconds();
console.log(seconds); // 7値は 0 から 59 の数値が返ってきます。
getMilliseconds()
getMilliseconds()は秒の取得をする際に使用します。
let milliseconds = new Date().getMilliseconds();
console.log(milliseconds); // 965値は 0 から 999 の数値が返ってきます。
世界標準時を基準として取得したい場合
世界標準時を基準として値を取得したい場合は、下記のように get と〇〇の間に UTC をつけるだけです。
let hour = new Date().getHours();
let utc_hour = new Date().getUTCHours();
console.log(hour); // 14
console.log(utc_hour); // 5他にもたくさんあるので、気になる方はこのページを見てみてください。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Date
