Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【JavaScript ECMAScript】Array::Array.prototype.toSortedインスタンスメソッドの使い方

Array.prototype.toSorted()インスタンスメソッドの使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

Array.prototype.toSorted()メソッドは、JavaScriptのArrayオブジェクトに定義されているインスタンスメソッドで、配列の要素をソートし、その結果を格納した新しい配列を作成して返します。このメソッドの最大の特徴は、元の配列の内容を一切変更しない「非破壊的」な操作である点です。JavaScriptの既存のsort()メソッドとは異なり、toSorted()は元の配列の状態を保護するため、開発者が誤って元のデータを破壊してしまうリスクを避けることができます。

ソートの順序は、オプションで比較関数(compareFn)を引数として渡すことでカスタマイズ可能です。比較関数は、ソート対象の2つの要素を受け取り、それらの相対的な順序を示す数値を返します。具体的には、負の数を返せば1つ目の要素を2つ目の要素より前に、正の数を返せば2つ目の要素を1つ目の要素より前に配置し、0を返せば順序を変更しないことを意味します。もし比較関数が提供されない場合、toSorted()メソッドは配列の要素を文字列として扱い、Unicodeのコードポイント順にソートを行います。

このように、toSorted()メソッドは、元の配列を保護しつつ、特定の順序で並べ替えられた新しい配列が必要な場合に非常に有用です。特に、元のデータの一貫性を保ちながら、様々な条件でソートされたデータを表示する必要があるシステム開発において、安全で信頼性の高いソート処理を実現するための強力なツールとなります。

公式リファレンス: Array.prototype.toSorted()

構文(syntax)

1const originalArray = [/* 任意の要素 */];
2const newSortedArray = originalArray.toSorted(/* (a, b) => a - b のような比較関数 (オプション) */);

引数(parameters)

compareFn

  • compareFn: (a, b) => number: 配列の要素をソートする順序を定義する比較関数。2つの引数 a と b を取り、以下のいずれかの数値を返します。
    • a が b より小さい場合は負の数
    • a が b と等しい場合は 0
    • a が b より大きい場合は正の数 この引数を省略した場合、要素は文字列として昇順にソートされます。

戻り値(return)

Array

このメソッドは、元の配列を変更せずに、要素を昇順または指定された比較関数に基づいてソートした新しい配列を返します。

関連コンテンツ

関連プログラミング言語