JavaScriptの日付と時間操作

JavaScriptでの日付と時間の取り扱いは、Web開発において非常に重要な要素です。正確に日付と時間を管理し、表示するためには、JavaScriptが提供する組み込みのDateオブジェクトや、他のライブラリを活用する必要があります。この記事では、JavaScriptでの日付と時間の操作方法について、基礎から応用まで幅広く解説します。

1. JavaScriptのDateオブジェクトとは？

JavaScriptでは、Dateオブジェクトを使用して、日付と時間を扱います。Dateオブジェクトは、特定の日時を表現し、操作するためのさまざまなメソッドを提供します。このオブジェクトを使うことで、現在の日時を取得したり、日時の計算を行ったり、フォーマットを変更することができます。

javascript
CopyEdit
// 現在の日付と時刻を取得
const now = new Date();
console.log(now); // 例: "2025-03-25T14:30:00.000Z"

上記のコードでは、new Date()を使って現在の日付と時刻を取得しています。この時、Dateオブジェクトは、ISO 8601フォーマット（例: YYYY-MM-DDTHH:mm:ss.sssZ）で日付を返します。

2. Dateオブジェクトのインスタンス生成方法

Dateオブジェクトは、いくつかの方法でインスタンスを生成できます。例えば、特定の日時を指定することも可能です。

(1) 現在の日付と時刻

javascript
CopyEdit
const now = new Date();
console.log(now); // 現在の日時

(2) 特定の日時を指定する

javascript
CopyEdit
const specificDate = new Date('2025-03-25T12:00:00');
console.log(specificDate); // 2025-03-25T12:00:00

(3) 年、月、日を指定する

javascript
CopyEdit
const specificDate = new Date(2025, 2, 25, 12, 0, 0); // 年、月、日、時間、分、秒
console.log(specificDate); // 2025-03-25T12:00:00

注: 月は0から始まるため、2は3月を指します。

(4) ミリ秒で指定する

javascript
CopyEdit
const specificDate = new Date(1672531199000); // 1970年1月1日からの経過ミリ秒
console.log(specificDate);

3. Dateオブジェクトのメソッド

Dateオブジェクトには、日付や時間を操作するための多くのメソッドがあります。

(1) 現在の日付や時刻の取得

javascript
CopyEdit
const now = new Date();
console.log(now.getFullYear());  // 年を取得 (例: 2025)
console.log(now.getMonth());     // 月を取得 (0〜11で、0は1月)
console.log(now.getDate());      // 日を取得
console.log(now.getDay());       // 曜日を取得 (0: 日曜日, 6: 土曜日)
console.log(now.getHours());     // 時を取得
console.log(now.getMinutes());   // 分を取得
console.log(now.getSeconds());   // 秒を取得
console.log(now.getMilliseconds()); // ミリ秒を取得

(2) 日付や時刻の設定

javascript
CopyEdit
const now = new Date();
now.setFullYear(2026);
now.setMonth(5);  // 6月
now.setDate(15);
now.setHours(10);
now.setMinutes(30);
console.log(now); // 2026-06-15T10:30:00

(3) 日付の差分を計算

2つの日付の差をミリ秒単位で計算することができます。

javascript
CopyEdit
const startDate = new Date('2025-03-25');
const endDate = new Date('2025-04-25');
const diffTime = endDate - startDate; // ミリ秒で差を計算
console.log(diffTime); // 差分のミリ秒

ミリ秒単位の差を求めた後、例えば日数に変換することができます。

javascript
CopyEdit
const diffDays = diffTime / (1000 * 3600 * 24);
console.log(diffDays); // 日数を表示

4. 日付と時間のフォーマット

JavaScriptでは、日付を任意の形式でフォーマットするための組み込みメソッドはありません。そのため、Dateオブジェクトを手動でフォーマットする必要があります。

(1) ISO 8601形式に変換

javascript
CopyEdit
const now = new Date();
console.log(now.toISOString()); // 例: 2025-03-25T14:30:00.000Z

(2) ローカル形式で表示

javascript
CopyEdit
const now = new Date();
console.log(now.toLocaleDateString()); // 例: 2025/3/25（地域によって異なる）
console.log(now.toLocaleTimeString()); // 例: 14:30:00（地域によって異なる）

(3) カスタムフォーマット

日付のフォーマットを自分で指定する方法もあります。

javascript
CopyEdit
const now = new Date();
const formattedDate = `${now.getFullYear()}-${now.getMonth() + 1}-${now.getDate()}`;
console.log(formattedDate); // 例: 2025-3-25

5. ライブラリを活用した日付操作

JavaScriptでの日付操作を簡単にするために、人気のあるライブラリを使うことが一般的です。例えば、moment.jsやdate-fnsなどが広く使われています。

(1) moment.jsの使用例

javascript
CopyEdit
// moment.jsを利用した日付操作
const moment = require('moment');
const now = moment();
console.log(now.format('YYYY-MM-DD'));  // 例: 2025-03-25
console.log(now.add(2, 'days').format('YYYY-MM-DD')); // 2日後

(2) date-fnsの使用例

javascript
CopyEdit
import { format, addDays } from 'date-fns';
const now = new Date();
console.log(format(now, 'yyyy-MM-dd'));  // 例: 2025-03-25
console.log(format(addDays(now, 2), 'yyyy-MM-dd')); // 2日後

6. タイムゾーンと日付操作

JavaScriptでは、タイムゾーンに関する操作も重要です。特に、Intl.DateTimeFormatオブジェクトを使うことで、タイムゾーンに合わせた日付や時刻の表示が可能です。

javascript
CopyEdit
const now = new Date();
const formatter = new Intl.DateTimeFormat('ja-JP', { timeZone: 'Asia/Tokyo' });
console.log(formatter.format(now)); // 日本時間で表示

まとめ

JavaScriptでの日付と時間の取り扱いは、非常に多くのメソッドとライブラリが存在するため、用途に応じて最適な方法を選ぶことが重要です。組み込みのDateオブジェクトを使うことで基本的な操作は十分に可能ですが、複雑な操作やタイムゾーンに対応する場合には、外部ライブラリを活用することをお勧めします。日付と時間を正確に扱うことは、特にWeb開発においては非常に重要であるため、しっかりと理解して使いこなすことが求められます。