2.1 Dateオブジェクト
日付と数値の処理は、Webアプリ開発の重要な部分だよね。JavaScriptには、日付や数値を操作するための組み込みオブジェクトとメソッドが用意されてるんだ。この講義では、Date
オブジェクト、そのメソッド、そして日付と数値のフォーマット方法を見ていこう。
JavaScriptのDate
オブジェクトは、日付と時間を表すんだよ。現在の日時を取得する、日時を設定する、そしてフォーマットする多くのメソッドを持っているんだ。
Dateオブジェクトの作成
Date()
オブジェクトを作成するとさ、それは現在の日付と時間を含むんだよ、その作成時点のね。
Date
オブジェクトはいくつかの方法で作成できるよ。
1. 現在の日時:
const now = new Date();
console.log(now); // 現在の日付と時間を出力
2. 特定の日付と時間の設定:
const specificDate = new Date('2024-07-07T10:00:00');
console.log(specificDate); // 2024年7月7日の日付を出力
3. 数値を使って日時を設定する:
const anotherDate = new Date(2024, 6, 7, 10, 0, 0);
console.log(anotherDate); // 2024年7月7日の日付を出力
2.2 Date()オブジェクトのメソッド
日付コンポーネントの取得:
getFullYear()
: 年を取得 (4桁)getMonth()
: 月を取得 (0から11まで)getDate()
: 月の日を取得 (1から31まで)getHours()
: 時間を取得 (0から23まで)getMinutes()
: 分を取得 (0から59まで)getSeconds()
: 秒を取得 (0から59まで)
例:
const now = new Date();
console.log(now.getFullYear()); // 現在の年
console.log(now.getMonth()); // 現在の月 (-1)
console.log(now.getDate()); // 現在の日
console.log(now.getHours()); // 現在の時間
console.log(now.getMinutes()); // 現在の分
console.log(now.getSeconds()); // 現在の秒
日付コンポーネントの設定:
setFullYear(year)
: 年を設定setMonth(month)
: 月を設定setDate(day)
: 月の日を設定setHours(hours)
: 時間を設定setMinutes(minutes)
: 分を設定setSeconds(seconds)
: 秒を設定
例:
const date = new Date();
date.setFullYear(2025);
date.setMonth(0); // 1月
date.setDate(15);
date.setHours(12);
date.setMinutes(30);
date.setSeconds(45);
console.log(date.toString());
2.3 日付のフォーマット
JavaScriptは、日付を文字列にフォーマットするメソッドを提供してるよ。一番よく使われるのは、ロケールに依存して日付をフォーマットするtoLocaleDateString()
メソッドだね。
toLocaleDateString()の使用例:
const now = new Date();
console.log(now.toLocaleDateString('en-US')); // "7/7/2024" (MM/DD/YYYY)
console.log(now.toLocaleDateString('en-GB')); // "07/07/2024" (DD/MM/YYYY)
console.log(now.toLocaleDateString('ru-RU')); // "07.07.2024" (DD.MM.YYYY)
メソッド toLocaleTimeString()
toLocaleTimeString()
メソッドは、ローカライズされたフォーマットで時間を文字列として返すよ:
const now = new Date();
console.log(now.toLocaleTimeString('en-CA'));
console.log(now.toLocaleTimeString('en-GB'));
メソッド toLocaleString()
toLocaleString()
メソッドは、ローカライズされたフォーマットで日付と時間を文字列として返すよ:
const now = new Date();
console.log(now.toLocaleString('en-CA'));
console.log(now.toLocaleString('en-GB'));
メソッド toISOString()
toISOString()
メソッドは、ISO 8601フォーマットで日付と時間を返すよ:
const now = new Date();
console.log(now.toISOString()); // "2023-07-05T10:00:00.000Z"
2.4 数字のフォーマット
メソッド toLocaleString()
toLocaleString()
メソッドは、ローカル設定に応じて数字をフォーマットできるよ:
const number = 1234567.89;
console.log(number.toLocaleString()); // "1,234,567.89" アメリカのフォーマット、または "1 234 567,89" ローカルフォーマット
console.log(number.toLocaleString('de-DE')); // "1.234.567,89" ドイツのフォーマット
Intl.NumberFormatを使った数字のフォーマット
Intl.NumberFormat
コンストラクタは、さらに柔軟な数字フォーマットを提供するよ:
const number = 1234567.89;
const usFormatter = new Intl.NumberFormat('en-US');
console.log(usFormatter.format(number)); // "1,234,567.89"
const deFormatter = new Intl.NumberFormat('de-DE');
console.log(deFormatter.format(number)); // "1.234.567,89"
const customFormatter = new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD'
});
console.log(customFormatter.format(number)); // "$1,234,567.89"
GO TO FULL VERSION