JavaScript's Date object is a built-in object for obtaining, setting, and manipulating dates and times.
JavaScriptの Dateオブジェクトは、日時の操作や計算を行うための組み込みオブジェクトです。これにより、現在の日時の取得、特定の日時の設定、日時の加減算、フォーマットなど、多様な日時関連の機能を利用できます。
JavaScript
const now = new Date();new Date()を呼び出すと、現在の日時を表すDateオブジェクトが生成されます。
HTML
<div id="dateArea"></div>
<script>
<!-- JavaScript code here -->
</script>JavaScript
// 現在の日時を取得
const now = new Date();
// HTML上の<div>要素に表示
document.getElementById('dateArea').textContent = now.toString();Dateオブジェクトは、ユーザーのデバイス（端末）のローカルマシン時間を参照して日時を扱います。ブラウザ上で new Date()を実行すると、その端末が持つ現在の時刻とタイムゾーン情報を基にオブジェクトが生成されます。したがって、ユーザーのPCやスマホの時計がズレていれば、生成される日時も実際の時刻とは異なる値になる可能性があります。
タイムスタンプ（ミリ秒）を指定
HTML
<div id="dateArea2"></div>
<script>
<!-- JavaScript code here -->
</script>JavaScript
const date = new Date(1672531200000); // 2023年1月1日
// HTML上の<div>要素に表示
document.getElementById('dateArea2').textContent = date.toString();日時文字列を指定
JavaScript
const date = new Date('2023-01-01T00:00:00');年、月、日、時、分、秒、ミリ秒を個別に指定
JavaScript
const date = new Date(2023, 0, 1, 0, 0, 0, 0); // 月は0から始まるDateオブジェクトから各要素を取得するメソッドがあります。
年を取得
JavaScript
const year = date.getFullYear();HTML
<dl>
<dt>現在の日時：</dt>
<dd id="dateNow"></dd>
<dt>年：</dt>
<dd id="dateYear"></dd>
</dl>
<script>
<!-- JavaScript code here -->
</script>JavaScript
const date = new Date();
const year = date.getFullYear();
// HTML上の<div>要素に表示
document.getElementById('dateNow').textContent = date.toString();
document.getElementById('dateYear').textContent = year.toString();月を取得（0から11）
JavaScript
const month = date.getMonth();HTML
<dl>
<dt>現在の日時：</dt>
<dd id="dateNow2"></dd>
<dt>月：</dt>
<dd id="dateMonth"></dd>
</dl>
<script>
<!-- JavaScript code here -->
</script>JavaScript
const date = new Date();
// 月は0から11で表されるので「+1」しています。
const month = date.getMonth() + 1;
// HTML上の<div>要素に表示
document.getElementById('dateNow2').textContent = date.toString();
document.getElementById('dateMonth').textContent = month.toString();日を取得
JavaScript
const day = date.getDate();曜日を取得（0から6、日曜が0）
JavaScript
const dayOfWeek = date.getDay();時、分、秒、ミリ秒を取得
JavaScript
const hours = date.getHours();
const minutes = date.getMinutes();
const seconds = date.getSeconds();
const milliseconds = date.getMilliseconds();タイムスタンプを取得（1970年1月1日からのミリ秒）
JavaScript
const timestamp = date.getTime();各要素を設定するメソッドも用意されています。
年を設定
JavaScript
date.setFullYear(2024);月を設定
JavaScript
date.setMonth(5); // 6月日を設定
JavaScript
date.setDate(15);他の要素も同様に設定可能
JavaScript
date.setHours(12);
date.setMinutes(30);
date.setSeconds(45);
date.setMilliseconds(500);日時の加減算は、タイムスタンプを用いるか、Dateオブジェクトのメソッドを利用します。
1日加算する
JavaScript
date.setDate(date.getDate() + 1);タイムスタンプを利用して1時間減算する
JavaScript
date.setTime(date.getTime() - 3600000); // 1時間は3600000ミリ秒Dateオブジェクトは直接比較できます。
JavaScript
if (date1 > date2) {
console.log('date1はdate2より後の日時です');
}日時を文字列として表示するためのメソッドがあります。
toString()
JavaScript
const str = date.toString();toISOString()
JavaScript
const isoStr = date.toISOString();toLocaleString()
JavaScript
const localStr = date.toLocaleString('ja-JP');カスタムフォーマット
自前でフォーマットする場合、各要素を組み合わせます。
JavaScript
const formattedDate = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;Date.now()
現在のタイムスタンプを取得します。
JavaScript
const timestamp = Date.now();Date.parse()
日時文字列を解析してタイムスタンプを返します。
JavaScript
const timestamp = Date.parse('2023-01-01T00:00:00');Date.UTC()
指定された日時のUTCタイムスタンプを返します。
JavaScript
const utcTimestamp = Date.UTC(2023, 0, 1);Dateオブジェクトは内部的に UTCで保持され、表示や取得の際にローカルタイムゾーンが適用されます。UTCで日時を取得・設定するメソッドも提供されています。
UTCの日時を取得
JavaScript
const utcHours = date.getUTCHours();UTCの日時を設定
JavaScript
date.setUTCFullYear(2024);JavaScript
const date = new Date(2023, 0, 32); // 2023年2月1日になる複雑な日時操作や国際化対応が必要な場合、以下のライブラリが役立ちます。
曜日の取得
JavaScript
function getWeekday(date) {
const weekdays = ['日', '月', '火', '水', '木', '金', '土'];
return weekdays[date.getDay()];
}
const date = new Date(2023, 0, 1);
console.log(getWeekday(date)); // "日"