1. 導入:なぜ日付の扱いは重要なのか?
Webサイトを作っていると「現在の西暦を表示したい(コピーライトなど)」や「日付を基準に条件分岐をしたい」という場面によく遭遇します。しかし、JavaScriptの日付データはそのまま扱うと非常に複雑で、人間が読み取れる形になっていません。そこで必須となるのが、日付から「年」だけをスマートに抜き出してくれる「Date.prototype.getFullYear()」という機能です。これを知ることで、日付の表示に関する悩みが一気に解決します。
2. 基礎知識:DateオブジェクトとgetFullYear
JavaScriptで日時を扱うには「Dateオブジェクト」という仕組みを使います。
Dateオブジェクトは、現在の日時を保持するための箱のようなものです。しかし、その箱の中身はコンピュータが計算しやすい形式になっているため、そのまま画面に出しても「Mon May 20 2024…」といった英語混じりの長い文字列になってしまいます。
「getFullYear()」は、そのDateオブジェクトの中から、私たちが知りたい「西暦(4桁の数字)」だけをピンポイントで取り出してくれるメソッド(命令)です。
3. 実装:getFullYearの使い方
使い方は非常にシンプルで、以下の3ステップです。
1. 現在の日時を入れる箱(変数)を作る。
2. その箱に対して「getFullYear()」を実行する。
3. 返ってきた数字を表示する。
4. サンプルプログラム:コピーして試してみよう
以下のコードをブラウザのコンソールや、HTMLファイルに貼り付けて動作を確認してみてください。
// 1. 現在の日時を取得して「now」という変数に入れる
const now = new Date();
// 2. getFullYear()を使って「年」だけを取り出す
const year = now.getFullYear();
// 3. 結果をコンソールに表示する
console.log("現在の西暦は:" + year + "年です");
// 応用:コピーライトの年を自動更新する(HTMLのid="year"に表示)
// document.getElementById('year').textContent = year;
5. 応用・注意点:現場で陥りやすい罠
初心者がよく間違えてしまうポイントが2つあります。
注意点1:getYear()は使わない
過去の古いJavaScriptには「getYear()」という似たメソッドが存在しますが、これは1900年からの経過年数を返してしまい、2000年以降は正しく表示されません。現在は非推奨なので、必ず「getFullYear()」を使うようにしましょう。
注意点2:月(getMonth)のズレに注意
「年」はgetFullYearで直感的に取得できますが、同じ仲間である「月」を取得する「getMonth()」メソッドは、0から11までの数字を返します(1月が0、12月が11)。「年」は直感的ですが、「月」を扱うときは「+1」する必要があるということを覚えておくと、現場でバグを減らすことができます。
まずはgetFullYear()を使って、現在の年を自由自在に取得することから始めてみてくださいね!