Date オブジェクトを使いこなす

2024-04-14

TypeScriptで日付と時刻をフォーマットする方法

Date オブジェクトのメソッドを使う

Date オブジェクトには、日付と時刻をフォーマットするための様々なメソッドが用意されています。例えば、以下のようにして、現在の日付を "yyyy年MM月dd日 HH時mm分ss秒" の形式でフォーマットすることができます。

const now = new Date();
const formattedDate = now.toLocaleDateString() + ' ' + now.toLocaleTimeString();
console.log(formattedDate); // 出力: 2024年4月14日 02時59分22秒

この方法では、比較的シンプルに日付と時刻をフォーマットすることができます。ただし、フォーマット形式を柔軟にカスタマイズしたい場合は、別の方法の方が適している場合があります。

ライブラリを使う

日付と時刻をフォーマットするためのライブラリもいくつか用意されています。例えば、以下のようなライブラリを使うことができます。

import * as moment from 'moment';

const now = new Date();
const formattedDate = moment(now).format('YYYY-MM-DD HH:mm:ss');
console.log(formattedDate); // 出力: 2024-04-14 02:59:22

ライブラリを使う場合は、事前にインストールする必要があります。例えば、npm を使って Moment.js をインストールするには、以下のコマンドを実行します。

npm install moment

どちらの方法を使うべきかは、状況によって異なります。シンプルに日付と時刻をフォーマットしたい場合は、Date オブジェクトのメソッドを使うのがおすすめです。一方、フォーマット形式を柔軟にカスタマイズしたい場合は、ライブラリを使うのがおすすめです。

Luxon: https://luxon.js/

TypeScript で日付と時刻をフォーマットするサンプルコード

Date オブジェクトのメソッドを使う

const now = new Date();

// 年月日だけフォーマット
const ymd = now.getFullYear() + '/' + (now.getMonth() + 1) + '/' + now.getDate();
console.log(ymd); // 出力: 2024/4/14

// 時刻だけフォーマット
const hmss = now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds();
console.log(hmss); // 出力: 02:59:22

// 曜日を含めてフォーマット
const ymdw = now.toLocaleDateString() + ' (' + now.toLocaleDateString('ja', { weekday: 'short' }) + ')';
console.log(ymdw); // 出力: 2024年4月14日 (日)

// ミリ秒まで含めてフォーマット
const fullFormat = now.toLocaleString();
console.log(fullFormat); // 出力: 2024年4月14日 02時59分22秒

Moment.js ライブラリを使う

以下のコードは、Moment.js ライブラリを使って、現在の日付と時刻を様々な形式でフォーマットする例です。

import * as moment from 'moment';

const now = moment();

// 年月日だけフォーマット
const ymd = moment(now).format('YYYY/MM/DD');
console.log(ymd); // 出力: 2024/04/14

// 時刻だけフォーマット
const hmss = moment(now).format('HH:mm:ss');
console.log(hmss); // 出力: 02:59:22

// 曜日を含めてフォーマット
const ymdw = moment(now).format('YYYY年MM月DD日 dddd');
console.log(ymdw); // 出力: 2024年4月14日 日曜日

// ミリ秒まで含めてフォーマット
const fullFormat = moment(now).format('YYYY年MM月DD日 HH時mm分ssSSSミリ秒');
console.log(fullFormat); // 出力: 2024年4月14日 02時59分22秒987

補足

上記のコードはほんの一例です。フォーマット形式は、自由にカスタマイズすることができます。
Moment.js ライブラリを使う場合は、事前にインストールする必要があります。詳細は、Moment.js の公式ドキュメントを参照してください。

TypeScriptで日付と時刻をフォーマットするその他の方法

テンプレートリテラルを使って、日付と時刻をフォーマットすることができます。以下のコードは、現在の日付を "yyyy年MM月dd日 HH時mm分" の形式でフォーマットする例です。

const now = new Date();
const formattedDate = `${now.getFullYear()}年${now.getMonth() + 1}月${now.getDate()}日 ${now.getHours()}時${now.getMinutes()}分`;
console.log(formattedDate); // 出力: 2024年4月14日 02時59分

テンプレートリテラルを使う方法は、シンプルで分かりやすいのが利点です。ただし、フォーマット形式が複雑になる場合は、見づらくなってしまうという欠点もあります。

const now = new Date();
const formattedDate = now.toLocaleDateString() + ' ' + now.toLocaleTimeString();
const formattedDateWithRegex = formattedDate.replace(/(\d{4})-(\d{1,2})-(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})/, '$1-$2-$3 $4:$5:$6');
console.log(formattedDateWithRegex); // 出力: 2024-04-14 02:59:22

正規表現を使う方法は、柔軟にフォーマット形式をカスタマイズできるのが利点です。ただし、正規表現の構文が複雑で分かりにくいという欠点もあります。

const now = new Date();
const formattedDate = new Intl.DateTimeFormat('ja-JP', { year: 'numeric', month: 'numeric', day: 'numeric' }).format(now);
console.log(formattedDate); // 出力: 2024年4月14日