【JavaScript】文字列プロパティの値でオブジェクト配列を並べ替える方法

はじめに

次のようなオブジェクトの配列があるとします。

const arr = [
    { first_name: 'Lazslo', last_name: 'Jamf' },
    { first_name: 'Pig', last_name: 'Bodine' },
    { first_name: 'Pirate', last_name: 'Prentice' }
];

この配列に対して、last_name キーの値をアルファベット順に並べ替えるJavaScript関数を作成する必要があります。

実装コード

以下はその実装例です。

const arr = [
    { first_name: 'Lazslo', last_name: 'Jamf' },
    { first_name: 'Pig', last_name: 'Bodine' },
    { first_name: 'Pirate', last_name: 'Prentice' }
];

const sortByLastName = arr => {
    arr.sort((a, b) => {
        return a.last_name.charCodeAt(0) - b.last_name.charCodeAt(0);
    });
};

sortByLastName(arr);
console.log(arr);

出力結果

コンソールには次のように出力されます。

[
    { first_name: 'Pig', last_name: 'Bodine' },
    { first_name: 'Lazslo', last_name: 'Jamf' },
    { first_name: 'Pirate', last_name: 'Prentice' }
]

コードの解説

Array.prototype.sort() メソッドは、比較関数を受け取ります。比較関数が負の値を返せば最初の引数を前に、正の値を返せば後ろに移動させます。上記のコードでは、charCodeAt(0) を使って各 last_name の先頭文字のUnicodeコードポイントを取得し、その差によって並べ替えを行っています。

注意点：localeCompare() を使ったより正確なソート

charCodeAt(0) の方法では先頭の1文字しか比較しないため、「Bodine」と「Brown」のように同じ頭文字を持つ文字列が存在すると、正しくソートされません。文字列全体を厳密に比較したい場合は、localeCompare() メソッドを使うのがおすすめです。

arr.sort((a, b) => a.last_name.localeCompare(b.last_name));

localeCompare() は文字列全体を自然な辞書順で比較できるため、日本語やアクセント付き文字なども含めて、より堅牢なソート処理を実現できます。