読者です 読者をやめる 読者になる 読者になる

つばさのーと

つばさの日常を綴るのーと

JavaScriptで翌月の日付を取得するときにちょっとした調整を行う方法

f:id:tsubasa123:20170119171032j:plain

 

こんにちは、つばさ(@tsubasa123)です。

 

初歩的なことなんですが、結構ハマったのでメモ記事です。JavaScriptの日付処理はどうしてこうも落とし穴が多いのでしょうか。

 

基本的な日付の取得方法

 

developer.mozilla.org

 

リファレンスを見れば使い方の大枠は掴めますね。

 

// Dateインスタンスを生成
const d = new Date();

console.log(d.getFullYear()); // 2017
console.log(d.getMonth() + 1); // 1
console.log(d.getDate()); // 23
console.log(d.getHours()); // 18
console.log(d.getMinutes()); // 23
console.log(d.getSeconds()); // 33

 

これが基本的な使い方じゃないでしょうか。インスタンスのメソッドをコールすればそれぞれの値が取得できます。多くのサイトで説明されていますが、月の値を取得する際には返り値が「0~11」になっているので +1 する必要があります、これも地味に忘れててハマることが多いので気をつけましょう。

 

1ヶ月後っていつだ?

 

で、今回の主題はこれ。今月末の1ヶ月後っていつでしょう?2017年1月31日の1ヶ月後です。2017年2月は28日までしかありません。さて、1ヶ月後はいつでしょう?

 

色々悩んだんですが、

 

  • 2017年2月28日
  • 2017年3月1日
  • 2017年3月3日

 

の3つ、どれも間違いじゃないような気がしまして。2月は28日までしかないのでちょっと特別ですが、3月31日の1ヶ月後、と問われたら4月30日でも5月1日でもどちらでも通じそうだなと。

 

2017年3月3日は私的にはちょっと想定外だったんですが、

 

d.setMonth(dd.getMonth() + 1);

 

こんな感じでJavaScriptの日付処理で月を +1 したら3月3日って表示されたんですよね。他の言語でも確認してみましたけど、3月3日と返ってきたのでこれもありなんだなという判断です。

 

選べるようにしよう

 

日付を扱う目的やコンテキストによってどれも正解に思えてきたし、どのパターンも使われる可能性がありそうなので、どれがいいか指定して翌月を取得できるようにすることにしました。ちょっと乱暴なコードですがまぁ、書き捨てのもので使う予定なのでセーフ。

 

(function() {

'use strict';

const d = new Date(2017, 1, 31);
const NEXT_MONTH_TYPE = {
    setDefault: 1,
    setEndOfTheMonth: 2,
    setFirstOfTheMonth: 3,
};
const printDate = (d) => {
    console.log(d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate());
};

const getNextMonthDate = (d, type) => {
    if (type === NEXT_MONTH_TYPE.setDefault) {
        d.setMonth(d.getMonth() + 1);
        return d;
    } else if (type === NEXT_MONTH_TYPE.setEndOfTheMonth) {
        d.setDate(1);
        d.setMonth(d.getMonth() + 1);
        d.setDate(d.getDate() - 1);
        return d;
    } else if (type === NEXT_MONTH_TYPE.setFirstOfTheMonth) {
        d.setDate(1);
        d.setMonth(d.getMonth() + 1);
        return d;
    }
};

printDate(d, NEXT_MONTH_TYPE.setDefault); // 2017-3-3
printDate(getNextMonthDate(d, NEXT_MONTH_TYPE.setEndOfTheMonth)); // 2017-3-31
printDate(getNextMonthDate(d, NEXT_MONTH_TYPE.setFirstOfTheMonth)); // 2017-4-1

})();

 

こんな感じ。変数名が決まらなかったけどまぁいいや。上記コードは翌月の取得ですが、条件を変えれば前月の日付を調整するコードに変更することもできるかな。暇があったら追記します。

 

さいごに

 

翌月っていつだ?って話でした。しょーもない話ですが、意外とこーゆーことに時間を取られるんですよね。これを機にもう少し日付処理の知識も蓄えたいところです。

 

ではでは、最後までお付き合いいただきありがとうございました。