よしもと芸人もりたけんじ
が作成した、JavaScript練習問題集に取り組んでいました。
その中の、問22でsort()メソッドを使う場面があり、自分の解答が解答例とは違っていたので
自分のやり方をここに書いておきます。
どちらが正しいか、どちらが現場で多く使われるかはちょっとわからないですが参考までに...。
解答例
/*問22
配列['e','a','k','B','c']を
大文字小文字区別なく順番通りにしてください。期待する値['a','B','c', 'e','k']*/
//回答例
let array = ['e','a','k','B','c'];
array.sort(function(a,b){
return a.toUpperCase() > b.toUpperCase() ? 1 : -1 ;
});
//結果:['a', 'B', 'c', 'e', 'k']
自分の解答
次に自分の解答です。
let array = ['e','a','k','B','c'];
array.sort(function(a,b) {
let A = a.toUpperCase();
let B = b.toUpperCase();
if(A < B) {
return -1;
}
if(A > B) {
return 1;
}
return 0;
});
//結果:["a", "B", "c", "e", "k"]
どちらも最終的な結果は同じですね。
両者の主な違いは比較関数の違い?でしょうか。
解答例の場合であれば以下の部分。
//解答例の場合
function(a,b){
return a.toUpperCase() > b.toUpperCase() ? 1 : -1 ; //「条件式? 式1 : 式2」
}
ここでは演算子の「?:」を使って条件式を表しています。
条件式がtrueの場合は式1を、falseの場合は式2を返します。
なので、下記のようにも書き換えられるでしょうか。
//解答例の比較関数を書き換えると...
function (a, b) {
if (a.toUpperCase() > b.toUpperCase()) {
return 1;
}
//a.toUpperCase() <= b.toUpperCase()
{
return -1;
}
};
そして自分の解答は以下のように比較関数を作成しました。それ以外は解答例と同じです。
function(a,b) {
let A = a.toUpperCase();
let B = b.toUpperCase();
if(A < B) {
return -1;
}
if(A > B) {
return 1;
}
return 0;
}
自分の解答の方では、function(a,b)が0を返した場合も条件式に含んでいます。
0を返したは場合は並べ替えはされずそのままになります。
compareFunction(a, b) が 0 を返した場合、a と b は互いに変更せず、他のすべての要素に対してソートします。注意: ECMAScript 標準はこの振る舞いを保証していないため、一部のブラウザー (例えば、遅くとも 2003 年以前のバージョンの Mozilla) はこれを遵守していません。
引用:Array.prototype.sort() - JavaScript | MDN
まとめ
今回の場合はどちらも結果は同じなので、あまり気になりませんが
現場とかではしっかり0を返した場合も条件式に入れておく方がいいのかな。
ひとまず個人的にはsort() メソッドの理解は前より深まったから今はこのくらいでいいや〜。
それと今回は比較関数についての説明を省きましたが、個人的に少しつまづいた部分でした。
「compare(a,b)のa,bって何を比較してんだ？？
aとb比較して-1返すってどう言うこと？？」
などなど。（なんで自分はこんなに理解力が乏しいんだ...）
そんな方は是非以下のサイトをみるのをオススメします！ 自分も初めから見つけられていれば...!!
漫画形式でとてもわかりやすくsort()メソッドについて解説されています（勿論それ以外も！）