【Javascript】月の加算・減算は月末に注意【Date()】

前回の記事

【C#, JS】 今年度を取得する - C-MOON

でDateオブジェクトの関数を利用した日付の減算を行いました。

// 現在から3ヶ月前にセット
date.setMonth(date.getMonth() - 3);

ここで、一つ疑問が湧きました。
「5月30日の1ヶ月前は4月30日だけど、5月31日はの1ヶ月前は何月何日になるのか？」

4月31日は存在しないので、月末の4月30日になるのでしょうか？

実際に試すことのできるプログラムを作成しました。
※日付入力欄はyyyy-mm-dd形式で入力します。存在しない日付はエラーになります。
※使用ブラウザがchromeやfirefoxの場合カレンダーが表示され、日付を選択できます。

---

月の引き算を行うサンプル

の
ヶ月前は...

です。

---

結果

実行結果を見てみると、5月31日の1ヶ月前は5月1日になります。
4月31日=4月30日+1日 → 5月1日ということでしょう。
同様に、5月31日の3ヶ月前は
2月31日=2月28日+3日 → 3月3日となります。(閏年でない場合)

ソースコード

最後にソースコードを貼っておきます。
html部分

<dev style="line-height: 200%;">
<input type="date" id="inputDate"> の<br>
<input type="number" id="subMonth" value="3" max="99" min="0" style="width: 3em"> ヶ月前は...<br>
<input type="button" value="計算する" onclick="calcDate();">
<p> 
    <div id="outputDate"></div> です。
</p>
</dev>

javascript部分

<script>
    var nowDate = new Date();

    var yyyy = nowDate.getFullYear();
    var mm = ("0"+(nowDate.getMonth()+1)).slice(-2);
    var dd = ("0"+nowDate.getDate()).slice(-2);

    // 日付入力欄の初期値をセット（今日の日付）
    var inputElem = document.getElementById("inputDate");
    inputElem.value=yyyy+'-'+mm+'-'+dd;

    // 結果の初期値をセット
    calcDate();

    // 日付の引き算をして、表示する関数
    function calcDate(){
        var outputElem = document.getElementById("outputDate");
        var outputDate = new Date(inputElem.value);
        var subMonth = document.getElementById("subMonth").value;

        // 入力した月を減算
        outputDate.setMonth(outputDate.getMonth() - subMonth);
        // yyyy/mm/dd 形式で表示
        outputElem.innerText = outputDate.toLocaleDateString();
    };
</script>

今回は以上です。