JavaScriptの sort((a, b) => a - b) を理解する

Java Scriptでは、「たった1行」で配列が魔法のように並び替えできるものがありますが、
その裏側を今回覗き込んでみました。

JavaScriptで、何気なく書くこの記述：sort((a, b) => a - b)。
「なぜこれで並び替えがうまくいくのか？」と疑問に思ったことはないでしょうか。
私はそう思いました。

Salesforce JavaScript Developer I 試験対策で登場したこの1行をテーマに、比較関数の仕組み・なぜ a - b が効くのか・NG例など、備忘録的にまとめようと思います。

✅ 出典元

Trailhead モジュール：
Explore Variables, Types, and Collections の Question 2/2

🧪 出題された問題

const arr = [7, 3, 400, 10];
Which statement sorts this number array so it is in ascending order?

A. arr.sort();
B. arr.sort((a, b) => a - b);
C. arr.sort((a, b) => a < b);
D. arr.sort((a, b) => b - a);

Bが正解なのは理解したのですが、
こんな短くてよく動くなと感じました。

🔍 sort() の基本仕様

JavaScriptの Array.prototype.sort() は、デフォルトで文字列として並べる仕様です。

const arr = [7, 3, 400, 10];
arr.sort();
console.log(arr); // [10, 3, 400, 7]

文字列として "10" < "3" になってしまうため、期待と異なる並びになります。

🧮 比較関数 (a, b) => a - b の意味

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

この一行は、次の関数定義と同じ意味です：

function compare(a, b) {
  return a - b;
}
arr.sort(compare);

📐 比較関数のルール

このルールに従って、JavaScriptの sort() は配列の中身をひたすら比較して並び替えてくれるとのことです。

戻り値	並び順
負の数	a が先（a < b）
正の数	b が先（a > b）
0	並び順そのまま

🔁 for ではなく「sortが自動で回してくれる」

以下で実行すると、何度も a と b の組み合わせで呼び出されている様子がわかります。

const arr = [7, 3, 400, 10];
arr.sort((a, b) => {
  console.log("比較中:", a, b);
  return a - b;
});

🧠 覚え方

a - b → 昇順（小さい順）
b - a → 降順（大きい順）

sortの比較関数は、「2つの値のどっちを先にすべきか」を数値で返す関数です。

📌 まとめ

１　sort() はデフォルトでは文字列としてソートされる
２　数値として正しく並べたいときは比較関数 (a, b) => a - b を渡す
３　仕組みを知ることで、ミスやバグを防げる

この記事が参考になったら、ZennのスキやTwitterシェアもぜひよろしくお願いします 😊