sort()メソッドで連想配列(オブジェクトの配列)をソートする方法

この記事ではJavaScriptの『sort()メソッド』を用いて、連想配列(オブジェクトの配列)をソートする方法を説明します。

分かりやすく説明するように心掛けています。ご参考になれば幸いです。

sort()メソッドを用いて、数字のプロパティを並び替える方法

例えば、以下のような連想配列(オブジェクトの配列)があるとします。

const items = [
  { name: 'テーブル', price: 4500 },
  { name: '椅子', price: 1500 },
  { name: 'ランプ', price: 3200 },
];

この連想配列(オブジェクトの配列)において、価格を昇順(安い順)に並び替えるには、以下に示すようにsort()メソッドを使用します。

const items = [
  { name: 'テーブル', price: 4500 },
  { name: '椅子', price: 1500 },
  { name: 'ランプ', price: 3200 },
];

// sort()メソッドを使用して並び替える
items.sort((a, b) => a.price - b.price);

console.log(items);
// ログ出力
// [
//   { name: '椅子', price: 1500 },
//   { name: 'ランプ', price: 3200 },
//   { name: 'テーブル', price: 4500 },
// ]

上記のサンプルコードでは、比較関数(a, b) => a.price - b.priceを使用しています。比較関数は、各要素(この場合はオブジェクト)をaとbとして取り、それらのpriceプロパティを比較しています。

価格を降順(高い順)に並び替えたい場合は、比較関数を次のように変更します。a.price - b.priceの結果を反対にするだけです。

items.sort((a, b) => b.price - a.price);

sort()メソッドを用いて、文字列のプロパティを並び替える方法

また、先ほど示した連想配列(オブジェクトの配列)において、名前を昇順に並び替えるには、sort()メソッドの比較関数を以下に示すように記述します。

const items = [
  { name: 'テーブル', price: 4500 },
  { name: '椅子', price: 1500 },
  { name: 'ランプ', price: 3200 },
];

// sort()メソッドを使用して並び替える
items.sort((a, b) => a.name.localeCompare(b.name));

console.log(items);
// ログ出力
// [
//   { name: 'テーブル', price: 4500 },
//   { name: 'ランプ', price: 3200 },
//   { name: '椅子', price: 1500 },
// ]

上記のサンプルコードでは、localeCompare()メソッドを使用しています。このメソッドは、文字列を辞書順に比較し、その結果を数値で返します。これにより、文字列のプロパティに基づいて配列を昇順に並び替えることができます。

名前を降順に並び替えたい場合は、比較関数を次のように変更します。

items.sort((a, b) => b.name.localeCompare(a.name));

本記事のまとめ

この記事ではJavaScriptの『sort()メソッド』について、以下の内容を説明しました。

sort()メソッドを用いて、数字のプロパティを並び替える方法
sort()メソッドを用いて、文字列のプロパティを並び替える方法

お読み頂きありがとうございました。