はじめに

今回は、JavaScriptのsort()について学んだことをまとめておきたいと思います。

sort()の基本構文の説明後、タイトルのサンプルコードを紹介します。

目次

1.sortメソッドとは
 2.本題
 3.参考記事

1. sortメソッドとは

sort()は、配列の要素を並び替えるメソッドです。
引数を指定しない場合、配列内の各要素を文字列に変換して昇順で並び替えます。
また、並び替えた新しい配列を返すのではなく対象の配列そのものを変更します。

基本構文

配列データ.sort();

サンプルコード（引数なし）

const names = ['Koki', 'Aya', 'Eita'];

console.log(names.sort());
//["Aya", "Eita", "Koki"]

配列内の各要素が文字列の場合は、上記のようなコードで並び替えることができます。
しかし、sort()は、配列内の各要素が数値の場合にも
数値を文字列に変換したあとで文字列として並び替えてしまいます。

そのため、数値として並び替えるためには引数にコールバック関数を指定して、
比較の方法を自分で定義する必要があります。

コールバック関数はfunction(a,b){}の形式をとり、aとbには配列の要素が渡されます。

ソートの条件は

コールバック関数の返り値が0未満のとき、a→bの順番に入れ替える
コールバック関数の返り値が0のとき、入れ替えなし
コールバック関数の返り値が0より大きいとき、b→aの順番に入れ替え

となっています。

サンプルコード（引数にコールバック関数指定）

const nums = [1, 30, 12, 17];

nums.sort(function(a, b){
  if (a > b){
    return 1;
  }else if (a < b){
    return -1;
  }else{
    return 0;
  }
});

console.log(nums);
// [1, 12, 17, 30]

上記のサンプルでは、数値を文字列に変換することなく数値のまま比較しているので、
数値の大きさに従って並び替えることができています。

また、コールバック関数はアロー関数式を使って次のように簡略化することもできます。

サンプルコード（アロー関数式でコールバック関数指定）

const nums = [1, 30, 12, 17];

nums.sort((a, b) => a - b);

console.log(nums);
// [1, 12, 17, 30]

2. 本題

scoreをキーとして並び替えをおこないます。

連想配列をソートする

const objArr = [
   {name: 'A', score: 70},
   {name: 'B', score: 30},
   {name: 'C', score: 65},
   {name: 'D', score: 90}
];

objArr.sort((a, b) =>
  a.score > b.score ? 1 : -1;  
);

console.log(nums);
/*
[
   {name: 'B', score: 30},
   {name: 'C', score: 65},
   {name: 'A', score: 70},
   {name: 'D', score: 90}
]
*/

以上で実装完了です。
連想配列をソートすることができました。

3. 参考記事