sort(並び替え) - Javascript

sort メソッド

文字列や数字の昇順・降順で対象の値を並び替えることができる破壊的メソッドです。

const fruits = ["banana", "orange", "apple"];

console.log(fruits.sort());
console.log(fruits);

// 結果
[ 'apple', 'banana', 'orange' ]
[ 'apple', 'banana', 'orange' ]

配列の並び替え

let array = [
  "a",
  "あ",
  "sss",
  "か",
  "テスト"
];

console.log(array.sort());

for(let i = 0; i < array.length; i++){
  for(let j = 0; j < array[i].length; j++){
    // 配列arrayのそれぞれの文字のUnicodeコードポイントを表示
    console.log(array[i][j] + ":" + array[i].codePointAt(j))
  }
}

// 結果
a:97
s:115
s:115
s:115
あ:12354
か:12363
テ:12486
ス:12473
ト:12488

オブジェクトの並び替え

以下のようにしても、オブジェクトの場合は並び替えが行われません。b.str と a.str は文字列なので、減算演算子（ - ）を使うと NaN（Not a Number）になります。

let array = [
  { str: "apple" },
  { str: "ぶどう" },
  { str: "orange" },
  { str: "バナナ" },
  { str: "すいか" },
];

array.sort(function(a, b){ return b.str - a.str});

console.log(array);

// 結果
[
  { str: 'apple' },
  { str: 'ぶどう' },
  { str: 'orange' },
  { str: 'バナナ' },
  { str: 'すいか' }
]

以下のコードの実行結果は、NaNになります。

let array = [
  { str: "apple" },
  { str: "ぶどう" },
  { str: "orange" },
  { str: "バナナ" },
  { str: "すいか" },
];

console.log(array[0]["str"] - array[1]["str"]);

// 結果
NaN

オブジェクトの値が数値の場合は、減算演算子を使ってもソートできます。

let array = [
  { number: 26 },
  { number: 1 },
  { number: 120 },
  { number: 80 },
  { number: 50 },
];

// 昇順
console.log(array.sort(function(a, b){ return a.number - b.number}));

// 降順
console.log(array.sort(function(a, b){ return b.number - a.number}));

// ---------------------------------------------------------------
// 以下の場合もソート可能でした
let array = [
  { number: "26" },
  { number: "1" },
  { number: "120" },
  { number: 80 },
  { number: 50 },
];

// 昇順
console.log(array.sort(function(a, b){ return a.number - b.number}));

// 降順
console.log(array.sort(function(a, b){ return b.number - a.number}));

オブジェクトの値が文字列の場合にソートするには、以下のようにします。

let array = [
  { str: "apple" },
  { str: "ぶどう" },
  { str: "orange" },
  { str: "バナナ" },
  { str: "すいか" },
];

// 昇順
console.log(array.sort((a, b) => { return (a.str < b.str) ? -1 : 1 }));

// 降順
console.log(array.sort((a, b) => { return (a.str > b.str) ? -1 : 1 }));

配列の並び替え

let num = [];
let min = 0;
let max = 29;

while(true){
    if(num.length == max + 1){
        break;
    }
    
    let r = Math.floor( Math.random() * (max + 1 - min) ) + min;
    if(num.includes(r) == false){
        num.push(r);
    }
}

function ascFunc(a, b) {
    return a - b;
}

function desFunc(a, b) {
    return b - a;
}

上記の配列 num を sort メソッドを使って並び替えると以下のようになります。

console.log(num.sort());

// 実行結果
[
   0,  1, 10, 11, 12, 13, 14, 15, 16,
  17, 18, 19,  2, 20, 21, 22, 23, 24,
  25, 26, 27, 28, 29,  3,  4,  5,  6,
   7,  8,  9
]

上記のようになる理由は、sortメソッドは、比較関数を指定しない場合、要素を文字列としてソートするためです。各要素を文字列に変換して、辞書順に並べます。

"10" の先頭の "1" は "2" より小さいため、"10" は "2" より前に来ます。

この結果、「1から始まる数値」→「2から始まる数値」→「3から始まる数値」… という順序になります。

数値の値どおありに昇順・降順に並べ替えるには以下のようにします。

console.log(num.sort(ascFunc));
console.log(num.sort(desFunc));