JavaScriptで「月-年」(MM-YYYY)形式の配列を古い順に並べ替える方法

問題の概要

JavaScriptでは、「月-年」(MM-YYYY) 形式の日付文字列を格納した配列を、古い日付から新しい日付へと並べ替えたいケースがあります。たとえば、次のような配列を考えてみましょう。

const arr = ["1-2016", "7-2015", "7-2016", "3-2016", "8-2016", "2-2016", "6-2016", "8-2015", "5-2016", "4-2016", "9-2015", "10-2015", "11-2015", "12-2015"];

このような配列を受け取り、最も古い日付から最も新しい日付の順にソートする関数を作成する必要があります。

解決のポイント

「月-年」という形式の文字列は、そのまま比較しても正しい順序にはなりません。そこで、次の手順で比較用の値を組み立てます。

• split('-') を使って月と年に分割する
• 月を2桁に揃える(ゼロ埋め)ことで、正確な大小比較を可能にする
• 「年 + 月」の形に結合し、sort() のコールバック関数内で数値として比較する

サンプルコード

const arr = ["1-2016", "7-2015", "7-2016", "3-2016", "8-2016", "2-2016", "6-2016", "8-2015", "5-2016", "4-2016", "9-2015", "10-2015", "11-2015", "12-2015"];

// 月を2桁の文字列にゼロ埋めするヘルパー関数
const padToString = (num) => {
    return String("0" + num).slice(-2);
};

// 比較関数:年と月を組み合わせて大小を判定する
const sortByDate = (first, second) => {
    const firstPart = first.split('-'), secondPart = second.split('-');
    const a = firstPart[1] + padToString(firstPart[0]);
    const b = secondPart[1] + padToString(secondPart[0]);
    return a - b;
};

arr.sort(sortByDate);
console.log(arr);

コードの解説

• padToString: 数値の先頭に「0」を付けた文字列を作り、後ろの2桁だけを切り出すことで、1桁の月を「01」「02」のような2桁表記に変換します。これにより、文字列比較でも誤りが起きなくなります。
• sortByDate: 各要素をハイフンで分割し、「年 + ゼロ埋めした月」の文字列を組み立てます。減算の際にJavaScriptが自動的に文字列を数値へ変換するため、正しく数値比較が行われます。
• arr.sort(sortByDate): 比較関数を渡して配列を昇順(古い順)に並べ替えます。

実行結果

コンソールへの出力は次のようになります。

[
    '7-2015', '8-2015',
    '9-2015', '10-2015',
    '11-2015', '12-2015',
    '1-2016', '2-2016',
    '3-2016', '4-2016',
    '5-2016', '6-2016',
    '7-2016', '8-2016'
]

このように、元の配列は古い日付から新しい日付へと正しく並べ替えられます。ゼロ埋めによる桁揃えを行うことで、「10-2015」や「11-2015」のような2桁の月も含めて、意図した通りの順序でソートできる点がポイントです。