JavaScriptで生年月日から現在の年齢を計算する方法

ポートフォリオサイトなどで、自身の年齢を表示したい場合がありますよね。

HTMLにそのまま年齢を直書きすることも可能ですが、その場合は毎年手動で更新する必要がありなかなか面倒です。

そこで今回の記事では、生年月日から現在の年齢を計算する機能をJavaScriptで実装する方法を紹介します!

一度実装すると、ページが表示されるたびに年齢を計算して表示してくれるので、ぜひこの記事を参考にしてみてください。

目次

【コピペ用】生年月日から現在の年齢を計算するJavaScriptコード

まずはコピペしてすぐに使いたい方のために、コード全体を紹介しておきます。

function getAge(year, month, day) {

  // 今日の日付データを取得
  const today = new Date();

  // 生年月日の日付データを取得
  const birthdate = new Date(year, month - 1, day);

  // 今年の誕生日の日付データを取得
  const currentYearBirthday = new Date(today.getFullYear(), birthdate.getMonth(), birthdate.getDate());

  // 生まれた年と今年の差を計算
  let age = today.getFullYear() - birthdate.getFullYear();

  // 今日の日付と今年の誕生日を比較
  if (today < currentYearBirthday) {
    // 今年誕生日を迎えていない場合、1を引く
    age--;
  }

  // 年齢の値を返す
  return age;
}

// 結果をコンソールに出力
console.log(getAge(1997, 1, 17));

引数には、年・月・日の順番で生年月日を渡してください。

次で1行ずつコードの解説をしていきますので、詳しく知りたい方は読み進めてください。

【解説】生年月日から現在の年齢を計算するJavaScriptコードの解説

ここからは上で紹介したJavaScriptコードの解説を行います。

まずgetAgeという関数を定義していきます。

function getAge(year, month, day) {
  // ここに関数の中身を記述

  // 最終的に現在の年齢を返す
  return age;
}

引数には、year(誕生年),month(誕生月),day(誕生日)を渡し、最終的にage(現在の年齢)が返ってくるという機能にしていきます。

生年月日から年齢を計算するにおいて、以下の3つの日付データが必要になります。

  1. 今日の日付データ
  2. 生年月日の日付データ
  3. 今年の誕生日の日付データ

それぞれのデータは、new Date()で取得します。

まず今日の日付データですが、引数に何も指定しないと現在日時のデータを取得できます。

// 今日の日付データを取得
const today = new Date();

次に生年月日の日付データを取得します。

// 生年月日の日付データを取得
const birthdate = new Date(year, month - 1, day);

引数には、getAge関数に渡した生年月日の値が入ります。

month-1となっていますが、これはDateオブジェクト内では月のカウントが0から始まるためです。(1月は0、12月は11で表します)

最後に、今年の誕生日の日付データを取得します。

// 今年の誕生日の日付データを取得
const currentYearBirthday = new Date(today.getFullYear(), birthdate.getMonth(), birthdate.getDate());

これで必要なデータが揃いましたので、次で年齢の計算をしていきます。

まずは単純に生まれた年と現在の年の差を求め、変数ageに格納します。

// 生まれた年と今年の差を計算
let age = today.getFullYear() - birthdate.getFullYear();

todayには現在日時の日付データ、birthdateには生年月日の日付データが入っていますね。

これらに対してgetFullYearメソッドを使用することで、年の値を取得することができます。

これで生まれてから何年経ったかは計算できましたが、

  • 今年すでに誕生日を迎えている
  • 今年まだ誕生日を迎えていない

上記によって年齢が変わってきますので、if文で条件分岐していきます。

// 今日の日付と今年の誕生日を比較
if (today < currentYearBirthday) {
  // 今年誕生日を迎えていない場合、1を引く
  age--;
}

この部分では、今年まだ誕生日を迎えていない場合、ageから1を引くという処理が行われています。

これで正確な年齢を取得することができました。

あとはageの値をreturnで返すことで、getAge関数の完成です!

// 年齢の値を返す
return age;

以上の手順で、生年月日から年齢を計算することができました。

【まとめ】JavaScriptで生年月日から現在の年齢を計算する方法

JavaScriptで生年月日から現在の年齢を計算する方法を紹介しました。

ページを開くたびに自動的に年齢を計算してくれるので、サイト上に年齢を表示する場合は是非使ってみてください。

Web制作に関する
記事案を募集中!

Web制作について知りたいこと、質問等ありましたら、以下のフォームから気軽に投稿してください。
要望が多かったものは解説記事を作成します。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

目次
閉じる