【広告 No.01】

2015年4月19日日曜日

【Javascript】二次元配列やオブジェクト(連想配列)を複数のキーでソートする

イメージ的にはエクセル上でのソートと近いものですね。オブジェクトを含んだ二次元配列を複数のキー(優先順位とする条件)でソートする必要があったのでメモしておきます。

【実現したいこと】

オブジェクトを含んだ二次元配列a[][]を任意の複数キーでソートしたい。

PHPならarray_multisort関数が使えるのですが、Javascriptでは実装する必要があります。



Javascriptによる二次元配列ソートでよくつまづくポイントは以下の3点でしょうから、それぞれについて確認してみましょう。
  1. 優先順位の設定
  2. 昇順(ASC)、降順(DESC)の設定
  3. オブジェクトの値をキーに設定
まずは以下共通で使用するサンプル配列の定義。
var ary = [
   ['2','1',2,'STSHISHO',{num:2}],
   ['1','2',1,'えすてぃーししょう',{num:1}],
   ['3','3',3,'会剃締死処',{num:3}],
   ['3','4',3,'エスティーシショウ',{num:3}],
   ['1','5',1,'@STSHISHO',{num:1}],
   ['2','6',2,'stshisho',{num:2}]
];

1.第1キーに0番目の要素(降順)、第2キーに3番目の要素(昇順)を指定しソート

ary.sort(function(a,b){
   if(a[0] < b[0]) return 1;//降順
   if(a[0] > b[0]) return -1;
   if(a[3] < b[3]) return -1;//昇順
   if(a[3] > b[3]) return 1;
   return 0;    //←なくても良い
});

/** 出力結果
ary = [
   ['3','4',3,'エスティーシショウ',{num:3}],
   ['3','3',3,'会剃締死処',{num:3}],
   ['2','1',2,'STSHISHO',{num:2}],
   ['2','6',2,'stshisho',{num:2}],
   ['1','5',1,'@STSHISHO',{num:1}],
   ['1','2',1,'えすてぃーししょう',{num:1}]
];
*/

優先順位の設定

上から順番に評価されますので、優先したいキーを先に記述します。基本的には例のように2行1組で考えます。

なお、ついつい三項演算子で以下のようにまとめようとしてしまいがちですが、そもそも二者択一ではないのでロジックとして間違いです。
return (a[0] < b[0])? -1: 1;//昇順判定をまとめようとした?

昇順(ASC)、降順(DESC)の設定

それぞれ昇順、降順の切り替えはreturnで返す値を交換します。(値をそのままにして、不等号の向きを逆しても同じですが、後々わかりづらいと思います。)
//昇順
ary.sort(function(a,b){
   if(a[0] < b[0]) return -1;
   if(a[0] > b[0]) return 1;
});

//降順
ary.sort(function(a,b){
   if(a[0] < b[0]) return 1;
   if(a[0] > b[0]) return -1;
});

2.第1キーにオブジェクトの値(降順)、第2キーに3番目の要素(昇順)を指定しソート

オブジェクトの値を使って評価する場合、ドットシンタックスでプロパティ名を指定するだけです。
ary.sort(function(a,b){
   if(a[4].num < b[4].num) return 1;//降順
   if(a[4].num > b[4].num) return -1;
   if(a[3] < b[3]) return -1;//昇順
   if(a[3] > b[3]) return 1;
});
/** 出力結果
ary = [
   ['3','4',3,'エスティーシショウ',{num:3}],
   ['3','3',3,'会剃締死処',{num:3}],
   ['2','1',2,'STSHISHO',{num:2}],
   ['2','6',2,'stshisho',{num:2}],
   ['1','5',1,'@STSHISHO',{num:1}],
   ['1','2',1,'えすてぃーししょう',{num:1}]
];
*/

当然ですが、最初の例と同じ結果になりますね。

以上、「二次元配列やオブジェクト(連想配列)を複数のキーでソートする」場合のロジック例でした。

【参考サイト】