JavaScript でオブジェクトの配列をプロパティで並べ替える
この記事では、オブジェクトのプロパティの値に基づいてオブジェクトの配列を並べ替える方法について説明します。
JavaScript では、sort() 関数を使用してオブジェクトの配列を並べ替えます。sort() 関数は、配列の要素を数値ではなくアルファベット順に並べ替えるために使用されます。アイテムを逆の順序で取得するには、reverse() メソッドを使用できます。
ただし、従来の sort() 関数は、いくつかのプロパティに基づいてオブジェクトの配列を比較するために遅れることがあります。したがって、sort() 関数で使用するユーザー定義の比較関数を作成できます。このメソッドは、配列内のアイテムのプロパティを比較します。
以下の例は、独自の比較関数を作成する方法を示しています。
let students = [
{fname: 'Rohan', lname: 'Dalal', age: 19},
{fname: 'Zain', lname: 'Ahmed', age: 17},
{fname: 'Anadi', lname: 'Malhotra', age: 19}
];
function compare_lname(a, b) {
if (a.lname.toLowerCase() < b.lname.toLowerCase()) {
return -1;
}
if (a.lname.toLowerCase() > b.lname.toLowerCase()) {
return 1;
}
return 0;
}
students.sort(compare_lname);
console.log(students)
出力：
[
{ fname: 'Zain', lname: 'Ahmed', age: 17 },
{ fname: 'Rohan', lname: 'Dalal', age: 19 },
{ fname: 'Anadi', lname: 'Malhotra', age: 19 }
]
上記の例では、最初に lname を小文字に変換してから、文字列の比較に応じて名前を比較します。オブジェクトの lname に基づいて、ソートされたオブジェクトの配列を返します。降順の場合、sort() 関数を reverse() に置き換えることができます。
文字列を処理する場合は、比較関数を作成する必要がなく、localeCompare() 関数を sort() 関数と一緒に使用するだけで目的の結果を得ることができます。
以下のコードを参照してください。
let students = [
{fname: 'Rohan', lname: 'Dalal', age: 19},
{fname: 'Zain', lname: 'Ahmed', age: 21},
{fname: 'Anadi', lname: 'Malhotra', age: 16}
];
students.sort((a, b) => a.lname.localeCompare(b.lname));
console.log(students);
出力：
[
{ fname: 'Zain', lname: 'Ahmed', age: 21 },
{ fname: 'Rohan', lname: 'Dalal', age: 19 },
{ fname: 'Anadi', lname: 'Malhotra', age: 16 }
]
localeCompare() は文字列に対してのみ機能します。これを数字に使用することはできません。
いくつかの数値プロパティに基づいてソートされた配列を取得するには、sort() メソッドでいくつかの比較関数を提供する必要があります。これは、sort() メソッドは通常、数値でも機能しないためです。
以下のコードを参照してください。
let students = [
{fname: 'Rohan', lname: 'Dalal', age: 19},
{fname: 'Zain', lname: 'Ahmed', age: 21},
{fname: 'Anadi', lname: 'Malhotra', age: 16}
];
students.sort((a, b) => {
return a.age - b.age;
});
console.log(students);
上記の例では、オブジェクトの年齢を比較し、この年齢に基づいてオブジェクトを並べ替えています。比較関数は 1 行しかないため、sort() メソッドで直接提供されます。すべてを降順で取得するには、reverse() 関数を使用します。
または、compare 関数で順序をシフトして、最終出力を降順で取得することもできます。
例えば、
let students = [
{fname: 'Rohan', lname: 'Dalal', age: 19},
{fname: 'Zain', lname: 'Ahmed', age: 21},
{fname: 'Anadi', lname: 'Malhotra', age: 16}
];
students.sort((a, b) => {
return b.age - a.age;
});
console.log(students);
出力：
[
{ fname: 'Zain', lname: 'Ahmed', age: 21 },
{ fname: 'Rohan', lname: 'Dalal', age: 19 },
{ fname: 'Anadi', lname: 'Malhotra', age: 16 }
]