普通にソートすると

以下のような配列をソートすることを考える。

['1日', '2日', '11日', '21日']

JavaScript組み込みのsort関数を使うと、

console.log(['1日', '21日', '2日', '11日'].sort());
// => Array ["11日", "1日", "21日", "2日"]

このように辞書順で並び替えられるため、直観的でない順序になってしまう。

sort関数にオプションを渡すと

sort関数にオプションを渡すことで、数値順を考慮した並べ替えを行うことができる。

console.log(['1日', '21日', '2日', '11日'].sort(new Intl.Collator("ja", { numeric: true }).compare));
// => Array  ["1日", "2日", "11日", "21日"]

{ numeric: true }のところが重要で、このオプションを渡すと「数値が入った文字列」をいい感じに並べ替えてくれるようだ。

Intl.Collatorには他にも便利なオプションが多数あるようですので、活用していきたい。