Program React web

【Javascript】現在の日付・日時を取得して表示する方法【Dateオブジェクト】

Dateオブジェクトを使い現在の日時を取得する

Dateオブジェクトは、JavaScriptにあらかじめ用意されているオブジェクトです。

使い方としては、以下のような感じ。

let today = new Date();
console.log(today);

このように使うと、以下のような感じでコンソールに表示されるのではないでしょうか。

だけを表示したい・時間だけを表示したいといった場合には、Dateオブジェクトが持つメソッドを利用します。

Dateオブジェクトが持つメソッドを利用する

Dateオブジェクトが持つメソッドの使い方は以下のような感じ。

年だけを取得したい

年だけを取得する場合はこんな感じ。

let today = new Date();
let year = today.getFullYear();
console.log(year);

このようにすれば、年だけが取得できます。

日だけを取得したい

日だけを取得したい場合はこんな感じ。

let today = new Date();
let date = today.getDate();
console.log(date);

このようにすれば、日だけが取得できます。

月だけを取得したい

月だけを取得したい場合はこんな感じ。すこしだけ注意が必要です

let today = new Date();
let month = today.getMonth() + 1;
console.log(month);

getMonth()メソッドでは、値を0から11の12個でカウントしています。

つまり、1月が0番目となるため、+1をすることで正しい月が数字として表示されます

○○年○○月○○日と表示するならこんな感じです。

let today = new Date();
let year = today.getFullYear();
let month = today.getMonth() + 1;
let date = today.getDate();
console.log(year + "年" + month + "月" + date + "日")

2022年4月12日 のように表示されているはずです。

これらは、Code Sand Box などですぐに試すことができます。

MDNのリファレンスを参照しましょう

MDN web docsには、JavaScriptのオブジェクトなどに関する使い方がより詳しく解説されています。

Dateオブジェクトのメソッドに関しても、他にもまだまだ存在します。

詳しい使い方に関しては、MDNのDateメソッドに関するページを参照してください。

-Program, React, web
-,