【JavaScript】リストを任意の順番にソートする

何度説明を読んでも分からなかったのがやっと出来るようになったので、未来の自分のために自分の言葉で整理しておきます。

Array.prototype.sort()の仕様

リストの中身を「文字コード順」でソートします。つまり

var test = [5,4,3,2,1]

なら

test.sort()
console.log(test)    // 1,2,3,4,5

と順当にソートされますが

var test2 = [1,5,10,15]

をソートすると

test2.sort()
console.log(test2)   // 1,10,15,5

とソートされてしまいます。オラァ。

sortの引数に比較用のメソッドを渡して任意の順番にソートする

ここね！ここ良くわかんなかったんですけどね！要するに

・引数を2つ取る関数を用意する
・2つの引数にそれぞれ、リストの1つめの要素（X）と2つめの要素（Y）が入ってくるものとする
・X>Yの時は正の数、X<Yの時は負の数、X=Yの時は0を返すように中身をなんとかする。

という要領です。

配列全体がどうなってるこうなってるは気にせず、とにかく、「リストの中の要素が2つ与えられた時」に「どうやって比べるのか」だけを考えて関数を作り、その関数自体をsortの引数として渡せばOKです。

例：文字＋数字で入ってくる文字列を数字部分の大小で比較する

var test3 = [test1.jpg, test3.jpg, test2.png, test4.png]

例えば、「jpegファイル名とpngファイル名が混在して入ってくるが、必ずファイル名は半角英字＋半角数字＋拡張子」という状態のファイル名リストを数字順に並び替えたい。

（英字部分が全部同じで数字が1桁までだと文字コード順でもいいけど、数字が2桁になると数字順にならなくなるし、英字部分が変わってもとにかく数字順にソートしたい、などの場合文字コード順じゃ困るのである）

    function __sort_by_filename_number(x,y){
       
       var number_x = Number(x.name.replace(/[a-z.]/g,""))
       var number_y = Number(y.name.replace(/[a-z.]/g,""))
       
       return number_x - number_y;
   }
   
   test3.sort(__sort_by_filename_number)

xもyも「拡張子つきのファイル名」が入っていくることが分かっているので、「アルファベットの部分と拡張子を全部消して、数字だけにして引き算」します。

そうすると簡単に、「Xの方が大きければ正の数、Xの方が小さければ負の数、同じなら0」が返ります。算数って便利だねぇ～～～

とりあえず「XとYを受け取って、Xの方が大きければ正の数、Xの方が小さければ負の数、同じなら0が返ってくる関数」が作れるようになればOK。