a,1,aaaaa
b,5,bbbbb
c,2,ccccc
d,4,ddddd
e,3,eeeee
f,1,fffff
Ajaxで上記のような内容が返されてくるのですが、2つめの項目の数値の昇順にソートして表示する簡単な方法を教えてください。
お願いします。
返される値が"a,1,aaaaa\nb,5,bbbbb\nc,2,ccccc\nd,4,ddddd\ne,3,eeeee\nf,1,fffff"のような、改行ありの文字列だとしての回答です。
//二次元配列に変換 var str = "a,1,aaaaa\nb,5,bbbbb\nc,2,ccccc\nd,4,ddddd\ne,3,eeeee\nf,1,fffff"; var strAry = str.split("\n"); var ary = new Array(); for( var cnt=0 ; cnt<strAry.length ; cnt++ ){ ary[cnt] = strAry[cnt].split(","); } //ソート ary.sort(function(a, b) { if(a[1] == b[1]){ return (a[0] > b[0]) ? 1 : -1; } return (a[1] > b[1]) ? 1 : -1; }); //確認 for( var cnt=0 ; cnt<ary.length ; cnt++ ){ alert(ary[cnt][0] + ary[cnt][1] + ary[cnt][2]); }
上記では数値が一つ目のソート条件、数値が一緒だったら一番目の文字をソート条件としています。sortメソッドの引数となっている無名関数を修正すれば色々できると思います。
返される値が"a,1,aaaaa\nb,5,bbbbb\nc,2,ccccc\nd,4,ddddd\ne,3,eeeee\nf,1,fffff"のような、改行ありの文字列だとしての回答です。
//二次元配列に変換 var str = "a,1,aaaaa\nb,5,bbbbb\nc,2,ccccc\nd,4,ddddd\ne,3,eeeee\nf,1,fffff"; var strAry = str.split("\n"); var ary = new Array(); for( var cnt=0 ; cnt<strAry.length ; cnt++ ){ ary[cnt] = strAry[cnt].split(","); } //ソート ary.sort(function(a, b) { if(a[1] == b[1]){ return (a[0] > b[0]) ? 1 : -1; } return (a[1] > b[1]) ? 1 : -1; }); //確認 for( var cnt=0 ; cnt<ary.length ; cnt++ ){ alert(ary[cnt][0] + ary[cnt][1] + ary[cnt][2]); }
上記では数値が一つ目のソート条件、数値が一緒だったら一番目の文字をソート条件としています。sortメソッドの引数となっている無名関数を修正すれば色々できると思います。
ありがとうございます。
もう少し教えてください。
このままですと、「1,2,11,3」という数値がある場合「1,11,2,3」となってしまいました。
文字としてソートされてしまっているのでしょうか?
また、この下記部分の意味が理解できませんので教えてください。
items.sort(function(a, b) {
if(a[1] == b[1]){
return (a[0] > b[0]) ? 1 : -1;
}
return (a[1] > b[1]) ? 1 : -1;
});
どうかよろしくお願いします。
追記です
if(Number(a[2]) == Number(b[2])){
return (a[0] > b[0]) ? 1 : -1;
}
return (Number(a[2]) > Number(b[2])) ? 1 : -1;
とすることで数値としてソートできましたが
もっと綺麗にすることはできませんでしょうか?
しかし、この部分がなぜソートになるのかが理解できません。。。
>>文字としてソートされてしまっているのでしょうか?
そうですね。worldtravelさんがされたようにNumber関数などで変換してください。
私であれば、以下のように二次元配列に変換する際に-0で数値化します。(値 - 0とすることで、javascript側で自動的に数値化してくれます)
for( var cnt=0 ; cnt<strAry.length ; cnt++ ){ ary[cnt] = strAry[cnt].split(","); ary[cnt][1] -= 0; }
>>また、この下記部分の意味が理解できませんので教えてください。
【(a > b) ? x : y;の形式について】
(a > b) ? x : y;は条件演算子です。(a > b) == trueならx値を、falseならy値を返します。
【array.sortについて】
Javascriptでは関数もオブジェクトであり、配列オブジェクトのsortメソッドでは順序付けを行う比較関数を引数として渡すことができます。その場合、array.sortメソッドは比較関数からの戻り値にしたがって配列内のオブジェクトをソートしてくれます。
比較関数とは、引数1が引数2より小さい場合は負の整数、両方が等しい場合は0、引数1が引数2より大きい場合は正の整数を戻り値とする関数です。
比較関数戻り値
if( arg1 < arg2 )return -1;
if( arg1 == arg2 )return 0;
if( arg1 > arg2 )return 1;
【無名関数】
先ほどのソースではsortメソッドにfunction(){}だけで定義した名前のない無名関数を引数として渡していましたが、以下のように無名関数ではなく通常の関数を渡すことも出来ます。
ary.sort(compare); function compare( a, b ){ if(a[1] == b[1]){ //return (a[0] > b[0]) ? 1 : -1; if(a[0] > b[0]){ return 1; }else{ return -1; } } //return (a[1] > b[1]) ? 1 : -1; if(a[1] > b[1]){ return 1; }else{ return -1; } }
ご丁寧にありがとうございました。
良くわかりました。
と言いたいところですが私は理解力が悪くなかなか理解できず、一部だけ理解できる状態です。^^;
もう少し勉強しながら理解できるように頑張ってみます。
ary[cnt][1] -= 0;
これで数値になるというのは面白いですね。
定石なのでしょうか...
こういうのも覚えないと...
本当にありがとうございました。
ありがとうございます。
もう少し教えてください。
このままですと、「1,2,11,3」という数値がある場合「1,11,2,3」となってしまいました。
文字としてソートされてしまっているのでしょうか?
また、この下記部分の意味が理解できませんので教えてください。
items.sort(function(a, b) {
if(a[1] == b[1]){
return (a[0] > b[0]) ? 1 : -1;
}
return (a[1] > b[1]) ? 1 : -1;
});
どうかよろしくお願いします。
追記です
if(Number(a[2]) == Number(b[2])){
return (a[0] > b[0]) ? 1 : -1;
}
return (Number(a[2]) > Number(b[2])) ? 1 : -1;
とすることで数値としてソートできましたが
もっと綺麗にすることはできませんでしょうか?
しかし、この部分がなぜソートになるのかが理解できません。。。