定義と使い方
配列の sort() 関数は、与えられた 元の配列の要素をソートします。
特徴
- デフォルトのソート順は、各要素を文字列に変換した後、**Unicodeコードポイント**順に従います。
- 必要に応じて**コールバック関数**を渡し、ソート基準を指定することも可能です。
- この関数は、与えられた元の配列を直接修正し、新しい配列を返しません。
- Unicodeコードポイント(Unicode code point)
- Unicodeコードポイントは、各文字を識別するために割り振られた固有の数値です。
これらのUnicodeコードポイント値は、英語、日本語、絵文字を含む多様な言語において規格化され、整列されています。この数値の大きさを基準として、文字をソートすることができます。
基本例
/* 基本のソート:文字列の配列をUnicodeコードポイント順にソートする例 */
const enStrings = ["d", "b", "c", "a"];
enStrings.sort();
console.log(enStrings); // ["a", "b", "c", "d"]
/* コールバック関数を使用して数値の大きさ基準で昇順にソートする例 */
const numbers = [1, 4, 1000, 10, 31];
function compareNumbers(a, b) {
return a - b;
}
numbers.sort(compareNumbers);
console.log(numbers); // [1, 4, 10, 31, 1000]
構文
arr.sort();
arr.sort(compareFunction);
arrは、sort() 関数を適用する元の配列です。
引数
compareFunction |
オプション。 ソート順を定義するコールバック関数です。
|
|---|
戻り値
ソートされた配列を返します。戻り値は変更された元の配列自体です。新しい配列は返しません。
使用上の注意事項
sort() 関数のデフォルトのソートは、各要素を文字列に変換した後、**Unicodeコードポイント**値のソート順に従います。必要に応じてコールバック関数を渡し、ソート基準を指定することができます。
この関数のデフォルトのソートにおいて核心となる **Unicodeコードポイント** 値のソート順とは何か、そして必要に応じてソート基準を指定する **コールバック関数** について解説します。
**Unicodeコードポイント**値のソート順
デフォルトのソート時、sort() 関数は各要素を文字列に変換した後、**Unicodeコードポイント**値のソート順で配列の要素をソートします。
Unicodeコードポイント値は、各文字を識別するために割り当てられた固有の数値です。
これらのUnicodeコードポイント値は、英語、日本語、絵文字を含む多様な言語において規格化され、整列されています。この数値の大きさを比較することで、どの文字が前か後ろかを知ることができます。したがって、この基準を利用して配列の要素をソートすることができます。
例えば、次の表のようになります。
| 区分 | 文字 | Unicodeコードポイント値(10進数) |
|---|---|---|
| 英大文字 | A |
65 |
| 英大文字 | B |
66 |
| 英大文字 | C |
67 |
| 英小文字 | a |
97 |
| 英小文字 | b |
98 |
| 英小文字 | c |
99 |
| 数字 | 0 |
48 |
| 数字 | 1 |
49 |
| 数字 | 2 |
50 |
| 日本語の音節 | あ |
12354 |
| 日本語の音節 | い |
12356 |
| 日本語の音節 | う |
12358 |
| 絵文字 | 😃 |
128512 |
| 絵文字 | 🙊 |
128586 |
上の表からわかるように、Unicodeコードポイント値の並び順を知ることで、文字列をUnicodeコードポイント値を基準にソートしたり、特定の文字同士の順序を比較したりすることができます。
上の表を参考に、次の例の結果がどのようになるか確認してみましょう。
/* アルファベット配列のソート例 */
const enStrings = ["d", "b", "c", "a"];
enStrings.sort();
console.log(enStrings); // ["a", "b", "c", "d"]
/* 日本語配列のソート例 */
const jpStrings = ["う", "あ", "い"];
jpStrings.sort();
console.log(jpStrings); // ["あ", "い", "う"]
Unicodeコードポイントに割り当てられた数値については、ウィキペディアのUnicode一覧を参考にしてください。
必要に応じて整列基準を指定する**コールバック関数**
sort()関数は、基本的には各要素を文字列に変換した後、**Unicodeコードポイント**値の並び順に従いますが、必要に応じて引数にコールバック関数を渡して整列基準を指定することができます。
sort()関数の構文
arr.sort();
arr.sort(compareFunction); // compareFunction (オプション): 引数にコールバック関数を渡して整列基準を指定
コールバック関数(compareFunction)の説明
コールバック関数(compareFunction)の構造は次の通りです。
/**
* コールバック関数
*
* @param a 比較する最初の要素です。undefinedになることはありません。
* @param b 比較するための2番目の要素です。undefinedになることはありません。
*
* コールバック関数は名前付き関数(ユーザー定義関数)や匿名関数などで使用できます。
* (当然ながら)すべてのコールバック関数はアロー関数として使用できます。
*/
compareFunction(a, b) {
// aとbを比較するロジック: 比較結果を返さなければなりません。
}
sort()関数に引数としてコールバック関数(compareFunction)が提供されると、この関数は2つの要素を引数として受け取って比較し、その戻り値に基づいて要素の位置を決定します。
- 戻り値が
0より小さい場合、最初の引数を2番目の引数より前に配置します。 - 戻り値が
0の場合、位置を変更しません。 - 戻り値が
0より大きい場合、最初の引数を2番目の引数より後に配置します。
この原理を利用すれば、ユーザー定義のソート(カスタムソート)を実行できます。例えば、次のような関数を使用して数値を昇順でソートすることができます。
const numbers = [1, 4, 1000, 10, 31];
function compareNumbers(a, b) {
return a - b;
}
numbers.sort(compareNumbers);
console.log(numbers); // 出力: [1, 4, 10, 31, 1000]
上の例でcompareNumbers()関数は2つの数値を引数として受け取り、a - bの結果を返します。
この値が負数であればaがbより前に位置し、0であれば位置を変更せず、正数であればa가 bより後に位置します。
したがって、numbers配列はcompareNumbers()関数を使用して昇順に整列されます。
注意点
sort()関数を使用して配列を整列(ソート)する際には、次のような注意点を把握しておく必要があります。
疎な配列と undefined 値を持つ要素
sort()関数は配列要素の値を基準に従って整列させます。
しかし、配列に値がない要素(疎な配列)や undefined 値がある場合には、常に配列の最後尾に移動します。
const sparseArr = [3, , 1, undefined, 2];
sparseArr.sort();
console.log(sparseArr);
// 出力例: [1, 2, 3, undefined, <1 empty slot>]
// undefined 値や値のない要素(疎な配列)は、整列結果において配列の末尾に位置します。
この際、こうした点を考慮して、実際の開発では疎な配列をあらかじめ filter() などで整理してから整列させると、予測可能な結果を得ることができます。
補足説明
配列の filter() 関数は、コールバック関数を使用して配列の要素をフィルタリングします。条件をコールバック関数として記述すると、その条件を満たす要素のみを新しい配列として返します。
const arr = [3, , 1, undefined, 2];
function hasValue(value) {
// undefined 値の要素を除去します。
return value !== undefined;
}
/*
* filter() は次のように動作します。
*
* 1. 疎な配列の空のスロットはコールバック関数が呼び出されないため、自動的に除外されます。
* 2. undefined 値を持つ要素はコールバック関数の戻り値が false であるため、除外されます。
*/
const filteredArr = arr.filter(hasValue);
filteredArr.sort();
console.log(filteredArr); // [1, 2, 3]
**Unicodeコードポイント**値の整列順序に関する誤解
sort()関数のデフォルトのソート(整列)は、各要素を文字列に変換した後、各文字を識別するために付与された Unicodeコードポイント値の整列順序を基準にして行われます。
この整列(ソート)方式は、一部の文字列の場合、私たちが期待する自然な順序で整列されているように見えることもあります。
const enStrings = ["A", "C", "B"];
enStrings.sort();
console.log(enStrings); // ["A", "B", "C"]
上の例の結果は、次のようなUnicodeコードポイント値の順序を見れば容易に予想できます。
| 区分 | 文字 | Unicodeコードポイント値 |
|---|---|---|
| 英大文字 | A |
65 |
| 英大文字 | B |
66 |
| 英大文字 | C |
67 |
しかし、次の例を見てみると、デフォルトの整列(ソート)方式の限界をはっきりと確認できます。
const enStrings = ["A", "a", "B"];
enStrings.sort();
console.log(enStrings); // ["A", "B", "a"] -> 小文字の "a" が大文字の "B" より後ろに整列されています。
このような整列(ソート)結果は、私たち人間が直感的に期待する自然な整列ではありません。一般的に、私たちは ["A", "B", "a"] ではなく ["A", "a", "B"] のような結果を期待します。
私たちが注意すべき点は、Unicodeコードポイント値の整列順序が、**人間が期待する自然な整列順序(Natural order)**とは異なる結果を生む可能性があるという点です。以下のUnicodeコードポイント値を見ると、小文字 a のUnicodeポイント値 97 は大文字 B のUnicodeポイント値 66 よりも大きいため、["A", "a", "B"] を sort() でデフォルト整列すると ["A", "B", "a"] と整列されます。
| 区分 | 文字 | Unicodeコードポイント値 |
|---|---|---|
| 英大文字 | A |
65 |
| 英大文字 | B |
66 |
| 英小文字 | a |
97 |
数字配列の整列
数字の配列を整列する際には注意が必要です。
sort() 関数のデフォルトの整列(ソート)は、配列の要素を文字列に変換して比較します。これは、整列時の比較基準が文字列であることを意味します。実際に配列の要素自体が文字列に変わるわけではなく、整列の過程で比較を行う際に、文字列に変換された値が使用されます。したがって、整列結果は文字列ではなく、元の要素の値が整列された配列として返されます。
例を挙げてみます。
/* 数値配列を整列(ソート)する例:
要素の数値を文字列として扱い、文字列の該当するUnicodeコードポイント順に整列 */
const numbers = [1, 1000, 4, 10, 31];
numbers.sort();
console.log(numbers); // 出力: [1, 10, 1000, 31, 4] <= 注意!! 文字列のように扱って整列される
この結果は、sort() 関数で整列した際に、配列の各要素が数値であっても文字列として扱って整列されるということを知らないと、予想とは異なる結果になる可能性があります。
数値配列を正しく整列するには、引数のコールバック関数として比較関数を提供する必要があります。
const numbers = [1, 1000, 4, 10, 31];
function compareNumbers(a, b) {
return a - b;
}
numbers.sort(compareNumbers);
console.log(numbers); // 出力: [1, 4, 10, 31, 1000]
このようにすれば、数字の配列を正しく昇順に整列することができます。
状況別の整列方法のまとめ
sort() 関数は配列を整列する際によく使用されますが、状況によっては期待とは異なる結果を生むことがあります。以下は、これまで見てきた sort() 関数の **状況別の整列方法** を整理した要約表です。
| 整列対象 | 整列方法(コード例) | 備考 |
|---|---|---|
| 単純な文字列 | arr.sort() |
Unicodeコードポイント値基準で整列(大文字 > 小文字の順) |
| 数字昇順 |
arr.sort(function (a, b) {
return a - b;
});
|
人間が期待する自然な大きさ順の整列 |
| 数字降順 |
arr.sort(function (a, b) {
return b - a;
});
|
大きな数字から順に整列 |
| データ精製後 |
arr.filter(function (value) {
return value !== undefined;
}).sort(...)
|
稀少配列や undefined 値を除去した後に整列 |
互換性
| メソッド |
デスクトップ Chrome
|
デスクトップデスクトップ Edge
|
デスクトップ Firefox
|
Safari
|
Node.js
|
|---|---|---|---|---|---|
sort()
|
1 | 12 | 1 | 1 | 0.10 |
仕様書
| 仕様書 | |
|---|---|
sort()
|
ECMAScript® 2026 Language Specification #sec-array.prototype.sort |