JavaScriptの配列を特定の順番にソートする方法

sort関数

ソートする関数が用意されていますので、sort関数を使います。パラメーターを入れないとアルファベット順になります。

//配列
var station = ["Shinjyuku","Ikebukuro","Shibuya","Ueno"]
//配列をソート
station.sort();
//出力用
alert(station); // Ikebukuro,Shibuya,Shinjyuku,Ueno

ちなみに配列の中身が数字の場合だと・・・

var number = [50000,40,900,3000]
number.sort();
alert(number); // 3000,40,50000,900

アルファベット順なので、このような並びになります。数値の大きさで比較されていません。

というわけで、数値の大きさの順番で並べたい時は以下のようにします。

//配列
var number = [50000,40,900,3000]
//配列をソート
number.sort(
function(a,b){
if( a < b ) return -1;
if( a > b ) return 1;
return 0;
}
);
//出力用
alert(number); // 40,900,3000,50000

これで数値が小さい順に並びました。数値を大きい順にしたいときはreturn -1とreturn 1を入れ替えます。

連想配列のソート

次に連想配列のソートをする場合です。

以下のコードは連想配列のnameをソートする場合です。配列は例として駅名と利用者数をnameとcustomersに入れてます。

まずは駅名（name）のアルファベット順に変更する場合です。（一部jQueryを使っています。）

$(function(){
//配列
var station = [
{name:"Shinjyuku",customers:736715}
,{name:"Ikebukuro",customers:544222}
,{name:"Shibuya",customers:403277}
,{name:"Ueno",customers: 172306}
];
//配列をソート
station.sort(
function(a,b){
var aName = a["name"];
var bName = b["name"];
if( aName < bName ) return -1;
if( aName > bName ) return 1;
return 0;
}
);
//出力用
for(i = 0 ; i < station.length ; i++ ){
$("#nameSort1").append("<li>" + i + "：" + station[i]["name"] + "：" + station[i]["customers"] + "</li>");
}
});

これを利用者数が多い順でソートする場合はsortのところを以下に変えます。

//配列をソート
station.sort(
function(a,b){
var aName = a["customers"];
var bName = b["customers"];
if( aName < bName ) return 1;
if( aName > bName ) return -1;
return 0;
}
);

参考ページ

• 配列のソートと無名関数 – マンガで分かる JavaScriptプログラミング講座