【JavaScript】日付の加算方法を初心者向けにわかりやすく解説
はじめに
日付を扱う場面は、プログラミングにおいてとても多いでしょう。 たとえば、予約システムで明日や来週の日時を表示するときや、特定の期間を計算して締め切り日を示すときなど、あらゆるアプリケーションで日付の加算が必要になります。
JavaScriptにはDateオブジェクトという組み込み機能があり、これを使うことで日付や時刻の操作ができます。 しかし、最初に触れたときには「年や月をどう追加するのか」「Dateオブジェクトのメソッドがどのように動くのか」など、戸惑う方も多いかもしれません。
そこで本記事では、JavaScriptで日付を加算する具体的な方法をわかりやすく整理してみます。 さらに、実務においてどのように活用できるのか、具体的なシチュエーションを交えながら解説していきます。
いずれも専門用語を使いすぎないように配慮しつつ、初心者でも理解しやすい文章を目指しています。 少しずつ手を動かしながら、あるいはコード例を見ながら学んでみてください。
この記事を読むとわかること
- JavaScriptのDateオブジェクトの基本的な使い方
- 日付を加算・計算する実装方法
- 単純な日付加算から、月・年を扱うときの注意点
- 実務での日付操作がどのように役立つか
ここから順を追って説明していきます。 まずは、Dateオブジェクトの基本概念から見ていきましょう。
Dateオブジェクトの基本
JavaScriptでは、日付や時刻を表すためにDateオブジェクトを用います。 プログラムの中で現在の日付・時刻を取得したいときや、自由な日時を表現したいときに役立つ存在です。
たとえば、以下のようにDateオブジェクトを生成できます。
// 現在の日付と時刻を表すDateオブジェクトを作成 const currentDate = new Date(); // 特定の日付を表すDateオブジェクトを作成 const specificDate = new Date("2025-12-25"); // 年・月・日・時・分・秒を個別に指定 // これは2025年12月25日10時30分0秒を表す例 const anotherDate = new Date(2025, 11, 25, 10, 30, 0);
ここで注意したいのが、JavaScriptの月指定は0が1月、11が12月になっていることです。
たとえば、new Date(2025, 11, 25)
は12月25日を意味します。
月を指定するときに「1月なのに0」となるため、慣れないうちは混乱しやすいかもしれませんね。
コンストラクタとメソッド
Dateオブジェクトにはいくつものコンストラクタ(生成方法)とメソッド(操作方法)があります。 上の例のように文字列や数字から生成できるのが基本です。 さらに、既存のDateオブジェクトから年月日を取得するためのメソッドがいくつか存在します。
getFullYear()
:年を取得getMonth()
:月を取得(0〜11)getDate()
:日を取得(1〜31)getHours()
:時を取得(0〜23)getMinutes()
:分を取得(0〜59)getSeconds()
:秒を取得(0〜59)
日付加算の話を始める前に、こうしたメソッドを使って年や月、日付を自由に取り出せることを押さえておくと理解が深まります。
実務での日付操作シーン
日付を計算する場面は多岐にわたります。 たとえば、キャンペーン終了日時を示す画面では、「今日から何日後なのか」を動的に計算して表示したいときがあります。 あるいは、予約アプリであれば「現在時刻から30分後の予約は可能か」などをチェックする処理など、日付と時刻を扱うことが求められるシーンがかなり多いのです。
実務で使うときは、タイムゾーンやサマータイムなどにも注意を払う必要があります。 ただ、本記事ではまずは純粋に日付を加算するロジックを学び、その上で起こりやすい落とし穴について触れていきます。
日付加算の基本的な方法
JavaScriptで日付を加算する方法として、代表的なやり方は2つです。
- Dateオブジェクトのsetterメソッドを利用する方法
- タイムスタンプ (ミリ秒) を用いて演算する方法
どちらも頻繁に使われる手段ですので、ひとつひとつ確認していきましょう。
setterメソッドで操作する
Dateオブジェクトには、setDate()
や setMonth()
などのsetterメソッドが存在します。
これらを使うことで、既存の日付を簡単に変更できます。
const date = new Date(2025, 0, 1); // 2025年1月1日 console.log(date.toString()); // => Wed Jan 01 2025 ... // 日付を5日後に変更する date.setDate(date.getDate() + 5); console.log(date.toString()); // => Mon Jan 06 2025 ...
上記の例では、 date.getDate()
で日付を取得して、それに5を足した値を date.setDate()
に渡しています。
これにより、1月1日から1月6日に更新されました。
同様に月を加算したい場合は setMonth()
を使いますし、年を加算したいときは setFullYear()
を使います。
ただし、月の加算には注意するポイントがあります。
ゼロベースで扱われるため、思わぬ結果にならないよう、現在の月を引き出してから必要な数値を加算し、再代入するという流れで処理します。
const date = new Date(2025, 0, 1); // たとえば、2ヵ月後に設定するには? const currentMonth = date.getMonth(); // 現在は0 date.setMonth(currentMonth + 2); // => 2025年3月1日
また、月を足したことで日付がオーバーフローする場合(たとえば「1月31日」に2ヵ月加算するときなど)は、JavaScriptが自動的に次の月へ繰り下げてくれます。 これを利用すれば、割と柔軟な日付操作ができるわけです。
ミリ秒で計算する
もうひとつの日付加算の方法として、ミリ秒を使った計算があります。 Dateオブジェクトは内部的に「1970年1月1日午前0時(UTC)からの経過ミリ秒」で日時を管理しています。
具体的には以下のように扱います。
const date = new Date(2025, 0, 1); const timeValue = date.getTime(); // => 1970年1月1日からの経過ミリ秒を取得 // 1日をミリ秒で表す const oneDayMs = 24 * 60 * 60 * 1000; // 10日分のミリ秒を加算 const newTimeValue = timeValue + (oneDayMs * 10); // 加算後の新しいDateオブジェクト const newDate = new Date(newTimeValue); console.log(newDate.toString()); // => 2025年1月11日 ...
1日は86,400,000ミリ秒なので、この計算を使って日付を自由に加算できるわけです。 日数が何百日も先であったり、月や年がまたいだりするケースでは、ミリ秒単位での演算がわかりやすいことがあります。
さらに、時刻差を単純に求めたいときにもこの方法は役立ちます。
2つのDateオブジェクトの getTime()
を引き算することで、どのくらいの時間差があるかを計算することができるからです。
日付加算の具体例
ここからは「実務でこういう場面があるかもしれない」という想定のもと、もう少し踏み込んだコード例を見ていきましょう。
予約システムの一例
たとえば、ホテル予約システムを想定してみます。 ユーザーがチェックインした日から7日後をチェックアウト予定日とする処理を行いたい場合、以下のようなイメージでコードが書けます。
function getCheckoutDate(checkinDate) { // checkinDateはDateオブジェクト const checkoutDate = new Date(checkinDate); checkoutDate.setDate(checkoutDate.getDate() + 7); return checkoutDate; } const userCheckin = new Date(2025, 5, 20); const userCheckout = getCheckoutDate(userCheckin); console.log(userCheckout.toString()); // => 2025年6月27日 ...
このように、チェックイン日に対して7日加算し、チェックアウト日を計算して返す仕組みです。 setterメソッドを使うので、非常に直感的な書き方といえるでしょう。
締め切りのカウントダウン
業務の中で何日後を期限にするようなシステムを作ることも多いと思います。 たとえば、書類提出の期限を「本日から10日後」としたい場合などは、ミリ秒で演算すると以下のようになります。
function getDeadlineDate(daysAfter) { const now = new Date(); const timeNow = now.getTime(); const oneDayMs = 24 * 60 * 60 * 1000; const targetMs = timeNow + (oneDayMs * daysAfter); return new Date(targetMs); } const deadline = getDeadlineDate(10); console.log(deadline.toString()); // => たとえば10日後の日付が表示される
こうすることで、現在の日付から指定の日数を加算した締め切り日が返ってきます。 ビジネスアプリケーションでもよくある機能なので、覚えておくと便利です。
月末やうるう年を考慮するコツ
日付加算で気をつけなければいけないのが、月末の扱いやうるう年などの特別なケースです。 JavaScriptの場合、これらのケースであっても、ある程度自動で調整してくれます。 しかし、どんな挙動になるかを把握しておかないと、思わぬバグにつながることがあります。
月末計算の例
Dateオブジェクトのsetterは、存在しない日付や月が指定された場合、自動的に正しい日付へ補正してくれます。 たとえば以下のようなコードを考えてみます。
const date = new Date(2025, 0, 31); // 2025年1月31日を指定 date.setDate(date.getDate() + 1); // => 2025年2月1日になる
1月31日の翌日を指定すると、正しく2月1日に変わります。 つまり、オーバーフロー(この場合、存在しない2月31日)が発生しても、JavaScriptが自動計算してくれるわけですね。
ただし、これは裏を返せば、コードを見ただけでは月が繰り越されたことに気づきにくいという問題もあります。 テストでしっかり確認しておかないと「思っていた日付と違う」と混乱してしまうかもしれません。
うるう年の例
うるう年の2月29日などに注意が必要と思われがちですが、こちらも自動補正が働きます。 たとえば、2024年はうるう年なので2月29日が存在しますが、日付の計算で3月1日に繰り上がる処理などもDateオブジェクトがある程度扱ってくれます。
// 2024年2月29日 const leapDay = new Date(2024, 1, 29); // 1日加算 leapDay.setDate(leapDay.getDate() + 1); // => 2024年3月1日
このように、JavaScriptのDateオブジェクトは多くの「日付の境界」に対して自動で正しい取り扱いをしてくれます。 いっぽう、時間帯(タイムゾーン)に関しては別問題なので、国際的なサービスや時差の扱いが必要なシステムではもう少し工夫が要ることもあります。
時刻や分単位の加算
日付そのものではなく、時刻や分単位で加算したいケースも多いと思います。 たとえば、現在時刻から30分後を計算する場合などです。
基本的な考え方は、先ほどのミリ秒計算と同じです。
30分後は 30 * 60 * 1000
ミリ秒後に相当するため、以下のようになります。
const now = new Date(); const nowMs = now.getTime(); const thirtyMinutesLaterMs = nowMs + (30 * 60 * 1000); const thirtyMinutesLater = new Date(thirtyMinutesLaterMs); console.log(now.toString()); console.log(thirtyMinutesLater.toString());
このシンプルな計算が意外と便利で、レストランの予約システムなどでも「現在から30分経過した時点でのテーブル状況」をチェックするときなどに使えます。 さらに、時刻を加算するときにも0〜23の範囲を超えれば日付が繰り上がりますし、これもDateオブジェクトが自動的に調整してくれます。
年単位の加算と注意点
年を加算する場合は、setFullYear()
を使って処理できます。
const date = new Date(2025, 5, 15); date.setFullYear(date.getFullYear() + 2); // => 2027年6月15日
ただし、年をまたぐような計算をするとき、月末が絡む場合には注意を要します。 先ほど触れたように、自動で月が繰り下がる現象が起きるため、思い通りの結果になるかどうかを、事前にしっかり確認しておくことが大切です。
実務で役立つシチュエーション例
ここからは、もう少し具体的にどのようなシチュエーションで日付加算が必要になるか例示してみます。
1. ユーザーの購読期間管理
多くのオンラインサービスでは、ユーザーが一定期間の購読権をもっています。 その権利が何日後・何ヵ月後・何年後に終了するのかを管理するとき、Dateオブジェクトで期限を設定しておき、その期限が過ぎたかどうかを判定するわけです。
function extendSubscription(baseDate, monthsToAdd) { const newDate = new Date(baseDate); const currentMonth = newDate.getMonth(); newDate.setMonth(currentMonth + monthsToAdd); return newDate; }
これで購読期限を延長できるので、「あと何日で購読が切れます」とユーザーに通知するなどの機能が作れます。
2. サービスのメンテナンス時刻
サービスのメンテナンスは深夜に行うことが多いですが、その開始や終了時刻を指定するときにも日時の加算が役立ちます。 たとえば「今日の深夜3時から2時間だけメンテナンスする」などのスケジュール管理を自動化する際に便利です。
function getMaintenanceWindow(hoursFromNow, durationHours) { const start = new Date(); start.setHours(start.getHours() + hoursFromNow); const end = new Date(start); end.setHours(end.getHours() + durationHours); return { start, end }; } const schedule = getMaintenanceWindow(3, 2); console.log(schedule.start.toString()); console.log(schedule.end.toString());
これによって、メンテナンスの開始時刻と終了時刻を動的に管理できます。
3. クーポンやポイントの有効期限
ポイントプログラムやクーポンなどで、受け取った日から30日間だけ使える、という設定をすることがよくあります。 そうした有効期限の計算にも日付加算は欠かせません。
function generateCouponExpiry(today, validDays) { // validDays: 有効期限の日数 const expiry = new Date(today); expiry.setDate(expiry.getDate() + validDays); return expiry; } const couponExpiry = generateCouponExpiry(new Date(), 30); console.log(`クーポンの有効期限: ${couponExpiry.toString()}`);
こうして有効期限が自動的に算出できれば、**「クーポンが期限切れになっていないか」**をチェックする機能を実装しやすくなります。
タイムゾーンとサマータイムの落とし穴
日付の加算はうまくいっているはずなのに、海外のユーザーの画面では時間がずれることがあります。 これはタイムゾーンやサマータイムに起因する問題です。
Dateオブジェクトは、環境ごとのローカルタイムゾーンをベースに動いています。 そのため、日本とアメリカとでは、同じコードでも結果が異なってくる可能性があります。 また、サマータイムを採用している国では、特定の時期に時計が1時間進んだり戻ったりするため、計算結果がずれてしまうことがあります。
国際的なサービスを作る場合は、日付の操作に加えて協定世界時(UTC)を活用した管理やタイムゾーンの変換が重要です。 シンプルな加算だけでなく、どの時間帯を基準にするかを明確にしておきましょう。
例えば、toUTCString()
や toISOString()
などのメソッドをうまく使い、常にUTC基準で計算したうえで、表示するときに現地時間に変換するといった工夫が考えられます。
大規模開発での考え方
大規模なシステムで日付計算を乱雑に扱うと、メンテナンスが難しくなりやすいです。 セットメソッドやミリ秒演算をあちこちで書いていると、月末・年末の境界ケースでバグが出たときに原因を追いにくくなります。
このような場合には、プロジェクト全体のスタイルとして、
- 「日付の加算は必ずミリ秒で行う」
- 「年・月が絡むときはsetterで行う」
などルールを作ると良いかもしれません。
ただし、JavaScriptの標準ライブラリだけでも十分に対応できるケースは多いです。 外部ライブラリの使用はプロジェクトの方針に合わせて慎重に検討するのが一般的でしょう。
ライブラリの使用
JavaScriptで日付を加算するには、Dateオブジェクトだけで不都合があるわけではありません。 しかし、月末や時差などが絡む複雑な計算を大量に書く場合、ライブラリを使うとソースコードが見やすくなることがあります。
世の中には日付操作を簡単にするライブラリがいくつかあります。 ただし、本記事では学習方法や書籍・コースの紹介は行いません。 ここでは「実務ではこういうライブラリもある」という一般的な情報だけにとどめましょう。
コードを書くときのポイントまとめ
ここまでの内容を簡単に整理すると、以下のようなポイントが挙げられます。
-
setterメソッドの活用
getDate()
などで取得した値に数を加え、setDate()
等で反映- 月のオーバーフローやゼロベース表記を踏まえる
-
ミリ秒演算の活用
getTime()
やnew Date(timeValue)
を組み合わせる- 日付・時刻差の計算が分かりやすい
-
月末やうるう年の自動補正に注意
- 思わぬ繰り越しが発生するケースを事前にテストする
- ただしJavaScriptが自動計算してくれる場面も多い
-
タイムゾーンとサマータイムの影響
- UTCをベースにするか、ローカルタイムを使うかを明確に
- 国際化対応が必要な場合はタイムゾーン変換を検討
-
大規模開発ではルールを統一
- setterメソッドで統一するか、ミリ秒演算で統一するかなど
- チーム内での書き方をそろえると保守性が高まる
こうしたポイントを頭に置いておくと、日付加算に関わるバグを減らし、複雑な要件にも対応しやすくなります。
この記事のポイントを活かす実装アイデア
最後に、ここで紹介した日付加算のテクニックを使った実装アイデアをいくつか見てみましょう。
実装アイデア1: 自動リマインド機能
「○日後に提出物がある」というタスク管理システムを作り、提出期限の前日にリマインドメールを送る機能をイメージしてください。 たとえば、以下のような流れです。
- タスクの締め切り日をDateオブジェクトで保存
- 保存時に前日にあたる日付を計算しておく
- 前日にメールを送るスケジューラを設定する
前日にあたる日付は、 deadline.setDate(deadline.getDate() - 1)
といった形で割り出せます。
あとはサーバーサイドのジョブスケジューラなどを使ってリマインド処理を走らせます。
実装アイデア2: 定期イベントの自動作成
定期的に開催されるイベントをカレンダーに自動登録するときにも、日付加算が活きてきます。 「毎週火曜日に繰り返す」「毎月1日に開催する」などのルールに基づいて、次回の日付を算出し、配列に一覧で持たせるイメージです。
function generateWeeklyEvents(startDate, weeks) { // startDateからweeks週分のイベント日を配列に格納 const events = []; const oneWeekMs = 7 * 24 * 60 * 60 * 1000; let currentMs = startDate.getTime(); for (let i = 0; i < weeks; i++) { events.push(new Date(currentMs)); currentMs += oneWeekMs; } return events; }
このようにミリ秒ベースで週ごとの日付を一括作成することで、カレンダーアプリなどに利用できます。
まとめ
ここまで、JavaScriptで日付を加算するための方法を中心に、その実務的な活用シーンや注意点について幅広く見てきました。
- Dateオブジェクトとsetterメソッドを使う方法
- ミリ秒 (タイムスタンプ)を使う方法
- 月末やうるう年などの自動補正の動き
- タイムゾーンやサマータイムの影響
- 実務でのユースケース(予約、締め切り管理、定期イベントなど)
日付の計算はシンプルに見えて、思わぬ落とし穴が潜む分野でもあります。 まずは基本となる加算の書き方に慣れておくことが大事です。 そうすれば、月末やうるう年も「JavaScriptが自動で処理する部分」と「自分で注意すべき部分」を整理しやすくなるでしょう。
今回取り上げたサンプルコードはあくまで一例にすぎませんが、これらを応用することで、実にさまざまなシステムの日時関連のロジックが組めるようになります。 毎日の開発で役立つ機会も多いはずです。
JavaScriptのDateオブジェクトは、月のゼロベース表記やタイムゾーンなど、やや入り組んだ挙動がある反面、基本の使い方をきちんと理解すれば多くのことをこなせる柔軟な機能です。 ぜひ本記事で紹介したポイントを参考に、皆さんも実際のプロジェクトで活用してみてください。