【JavaScript】配列をソートするならsort()! シンプルな使い方から応用まで
JavaScriptのsort()メソッドは、配列をソートする際の強力な道具です。この記事では、基本的な使い方から応用テクニックまで、sort()の活用方法について詳しく解説します。データを整理し、効率的に扱うために必須のスキルです。
3行で要約すると
sort()
はJavaScriptの配列をソートするためのメソッドです。- カスタム関数を使って、独自のソート条件も設定できます。
- ただし、ソートは元の配列を直接変更するため注意が必要です。
「sort()」の基本的な使い方
「sort()」とは?
sort()
はJavaScriptの配列で使えるメソッドで、配列の中身を並び替えるために使用します。そのまま使うと、要素が文字列としてアルファベット順にソートされます。
例:
const fruits = ["banana", "apple", "cherry"];
fruits.sort();
console.log(fruits); // ["apple", "banana", "cherry"]
ただ、数字を正しくソートするためや特定のルールでソートするためには「比較関数」というものを使います。
比較関数って何?
比較関数は、配列の中の2つの要素(これをaとbと呼びます)を取って、どちらが先に来るべきかを決める役割があります。
- 関数が正の数を返したら、bをaより前にします。
- 関数が0を返したら、aとbの位置は変わりません。
- 関数が負の数を返したら、aをbより前にします。
これを使うと、以下のように数字の配列を小さい順にソートできます。
const numbers = [40, 100, 1, 5, 25, 10];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 5, 10, 25, 40, 100]
ここで使われているa - b
は、aがbより小さければ負の数、等しければ0、大きければ正の数を返すという仕組みです。これを基に、aとbの位置が決まります。
このように、比較関数を使うことで、自分のルールで要素をソートすることができるのです。
「sort()」の使用例4パターン
文字列をソートする
const animals = ["dog", "cat", "elephant", "bee"];
animals.sort();
console.log(animals); // ["bee", "cat", "dog", "elephant"]
アルファベット順に動物の名前がソートされます。
数字をソートする
const numbers = [40, 100, 1, 5, 25, 10];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 5, 10, 25, 40, 100]
昇順に数字がソートされます。
オブジェクトのプロパティに基づいてソート
const people = [
{name: "John", age: 25},
{name: "Doe", age: 30},
{name: "Anna", age: 20}
];
people.sort((a, b) => a.age - b.age);
console.log(people);
年齢の昇順に人々がソートされます。
降順でソート
const scores = [40, 100, 1, 5, 25, 10];
scores.sort((a, b) => b - a);
console.log(scores); // [100, 40, 25, 10, 5, 1]
得点が高い順にソートされます。
「sort()」と「reverse()」
「reverse()」とは?
reverse()
は配列の要素の順序を逆にします。sort()
と組み合わせることで、降順のソートも簡単に実現できます。
例:
const fruits = ["banana", "apple", "cherry"];
fruits.sort().reverse();
console.log(fruits); // ["cherry", "banana", "apple"]
「sort()」と「reverse()」の違い
基本的にsort()
はソート、reverse()
は逆順にするだけの単純な動作です。ですが、二つを組み合わせることで多様なソートを実現できます。
「sort()」を使用する際の注意点
Unicode順でのソート
sort()
は、数字もUnicodeの文字セット順でソートされるため、数字の配列をそのままソートすると期待する結果にならないことがあります。
const numbers = [10, 5, 40, 25, 100, 1];
numbers.sort();
console.log(numbers); // [1, 10, 100, 25, 40, 5]
元の配列が変更される
sort()
は元の配列を直接変更します。この挙動を避けたい場合は、配列のコピーを作成してからソートすると良いでしょう。
「sort()」の使い方まとめ
JavaScriptのsort()
メソッドは、配列の要素をソートするための強力なツールです。基本的な使い方から応用テクニックまで、この記事で学んだ内容を実践に活かしてみてください。