お知らせ

【JavaScript 入門】【初学者向け】Dateオブジェクトで現在時刻を取得・操作する方法まとめ

JavaScript

どうも、こんにちは!ピコっそです。

最近JavaScriptやPHPでウェブ開発の勉強をしております。その中で、今回はJavaScriptで開発に欠かせない「Date」について解説を行おうと思います。

今回の記事は初学者向けの記事となっておりますが、中級者や上級者の方でも復習として読んでもらっても構いません(特に私自身Dateの使い方をよく忘れるので自分用としてもこの記事は残しておきたいです)

Dateは決して難しいオブジェクトではなく、使い方さえ理解すればだれでも簡単に使えますので、ぜひ最後まで読んでみてください。

Date()の定義・使い方

Date()の意味や使い方について解説します。

Date()とは

Date()とは、時間や日付を取得するためのオブジェクトです。

基本形は、以下通りです。

const date = new Date();

上記のコードは現在時刻今日の日付を出力するコードになります。

また、指定した日時や曜日を取得したい場合は、以下の通りです

const date = new Date("YYYY-MM-DD");

仮に”YYYY-MM-DD”内に「2025-12-12」と入れると以下のように出力されます。

Fri Dec 12 2025 09:00:00 GMT+0900 (日本標準時)

上記のように出力されます。また現在時刻・日付を取得するDate()の場合は、上記の出力内容が現在の日時になります。

出力内容を元号に直したい場合は、日本語表記名に出力内容を直す場合は、工夫が必要です(「Date()の使い方・実際の使用例」の箇所にて解説を行います。)

ポイント
・現在時刻を取得したい場合はnew Date()を使う

・指定した日時や曜日を取得したい場合はDateの()内に指定した年月を入れる

・出力形式は日本語表記に直す必要あり

実際の使用例

では実際の使用例を見てみましょう。

日本式の日付で出力させる

日本式で日付を出力させるコードは以下の通りです。

const date = new Date("2025-12-12");
//西暦を取得
const year = date.getFullYear();
//月を取得
const month = date.getMonth() + 1;
//日にちを取得
const day = date.getDate();

console.log(`${year}年${month}月${day}日`);

出力は以下の通りです。

2025年12月12日

ポイント
・getFullYear()、getMonth()、getDate()を使い、西暦、月、日にちを取得

・getMonth()は月が0〜11までなので「+1」をする

・出力する時は「年」「月」「日」の表記を忘れずに

西暦を元号に変えて出力

JavaScriptでは標準で元号変換機能がありませんが、上記のように if 文を使って
自分で西暦→元号への変換ロジックを作ることができます。

西暦を元号に変えて出力するコードは以下の通りです(明治時代以前は対応してません)

const date = new Date("2019-05-01"); // 変換したい日付を指定

const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();

let era = "";
let eraYear = 0;

// 元号の判定(明治以前は非対応)
if (year >= 2019) {
  era = "令和";
  eraYear = year - 2018;
} else if (year >= 1989) {
  era = "平成";
  eraYear = year - 1988;
} else if (year >= 1926) {
  era = "昭和";
  eraYear = year - 1925;
} else if (year >= 1912) {
  era = "大正";
  eraYear = year - 1911;
} else {
  era = "明治";
  eraYear = year - 1867;
}

console.log(`${era}${eraYear}年${month}月${day}日`);

出力結果は以下の通りです。

上記のように、2019年5月1日は令和の初日なので『令和1年』と出力されます

令和1年5月1日

ポイント
・元号の開始年を指定し、指定した西暦と比較する

・比較した後、指定した西暦から元号の開始年を引く

・元号を出力する。

日本式で現在時刻を出力させる

日本式で時刻を出力させるコードは以下の通りです。

const now = new Date();

const hour = now.getHours();   // 時
const minute = now.getMinutes(); // 分
const second = now.getSeconds(); // 秒

console.log(`${hour}時${minute}分${second}秒`);

出力例:

16時42分30秒 //実際は現在時刻で表記されます

ポイント
・getHours()、getMinutes()、getSeconds()で時間を取得

・取得したデータを単位をつけて出力

まとめ

今回はDate()の定義と使い方についてまとめました。

Date()は時間や日付を取得するためのオブジェクトです。

Date()の使い方は主に3つあり、

・日本式の日付で出力させる

・西暦を元号に変えて出力

・日本式で現在時刻を出力させる

上記の通りです。

また上記の使い方は全て初学者向けのものとなっておりますが、他にもいろんな使い方がありますので、ぜひ調べてみてください。

私個人の意見としては、new Date()で現在時刻を取得する以外にも、getHours()やgetFullYear()など覚えるべきメソッドが多く、忘れがちです。

実際にJavaScriptで時刻を扱うアプリ等を作る際は調べながら作ると効率的と私は考えます。

最後に

今回の記事でDate()の使い方が理解できた人が一人でもいれば嬉しい限りだと私は考えます。

ブログ活動のほかにもXでプログラミングの記事や情報を発信していますので、ぜひフォローの方、よろしくお願いいたします。

https://twitter.com/pikosso1268?s=21

では最後までご覧いただき、ありがとうございました。

今後も初心者でも理解しやすいJavaScript・PHPの基礎シリーズを投稿していきます!

どうぞよろしくお願いいたします。

コメント

タイトルとURLをコピーしました