複数オブジェクトからなる配列を、要素内のプロパティ値を基準にソート

9586 ワード
プログラミング初心者 JavaScript JavaScript テキストリンク

Array.prototype.sort()について

Javascript初心者です。
paizaで練習問題を特訓していましたが、以下のような配列をsortするのに
一苦労したので備忘録として残しておきます。
間違いや拙い点などあるかと存じますが、何卒ご了承ください。

// 配列の中のオブジェクトの中のプロパティ値を基準に並び変えたい
// これを
[
  { name: 'cat', power: 50 },
  { name: 'dog', power: 100 },
  { name: 'mosquito', power: 1 },
  { name: 'lion', power: 2000 },
]

// こうしたい
[
  { name: 'lion', power: 2000 },
  { name: 'dog', power: 100 },
  { name: 'cat', power: 50 },
  { name: 'mosquito', power: 1 },
]

その前にsort()の基本形

上記の例とは別で、配列の中にそのまま何らかの値が列挙されている場合の使い方。

辞書順に並べる

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// expected output: Array ["Dec", "Feb", "Jan", "March"]

名前の辞書順に並べたいだけならば、このように引数無しのsort()でOK。
だけど、ほとんどの場合は数値を基準に並べたい...

数値の昇順・降順で並べる

昇順
const months = [3, 1, 2, 12];

months.sort((a,b) => {
    return a - b;
});

console.log(months);
// expected output: Array [1,2,3,12]
降順
const months = [3, 1, 2, 12];

months.sort((a,b) => {
    return b - a;
});

console.log(months);
// expected output: Array [12,3,2,1]

sortの引数に比較関数を渡します。
a,bにはそれぞれ配列の中の数値が入っています。

returnが正の値 : 第１引数を第２引数の後ろに並べ変える
returnが負の値 : 第1引数を第2引数の前に並べ替える
returnが０ : 並べ変えを行わない

（となっていますが、正直よくわからないので機械的に覚えちゃってます...）

引用
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

本題

let creatures = [
  { name: 'cat', power: 50 },
  { name: 'dog', power: 100 },
  { name: 'mosquito', power: 1 },
  { name: 'lion', power: 2000 },
]

// a,bにはオブジェクトが入っているので、そのプロパティ名を指定して比較すれば並べ替え可能。
creatures.sort((a,b) => {
    return b.power - a.power; 
}); 

console.log(creatures);
// expected output:
//[
//  { name: 'lion', power: 2000 },
//  { name: 'dog', power: 100 },
//  { name: 'cat', power: 50 },
//  { name: 'mosquito', power: 1 },
//]

ひとこと

配列ループ系の関数は全部知っておいた方が良さそうです...
(forEach,map,filter ...etc)

Lambda式3
ブリッジモード(C++)