JavaScript でオブジェクトの配列をアルファベット順に並べ替える
-
JavaScript の
if条件とsort()関数を使用して、オブジェクトの配列をアルファベット順に並べ替える -
JavaScript の
localeCompare()およびsort()関数を使用して、オブジェクトの配列をアルファベット順に並べ替える -
JavaScript の
Collator()およびsort()関数を使用して、オブジェクトの配列をアルファベット順に並べ替える
このチュートリアルでは、JavaScript の sort() 関数を使用してオブジェクトの配列をアルファベット順に並べ替える方法について説明します。
JavaScript の if 条件と sort() 関数を使用して、オブジェクトの配列をアルファベット順に並べ替える
文字列または整数の配列がある場合は、JavaScript の sort() 関数を使用して簡単に並べ替えることができます。たとえば、sort() 関数を使用して文字列の配列をアルファベット順に並べ替えましょう。以下のコードを参照してください。
var a = ['banana', 'apple', 'orange'];
var m = a.sort();
console.log(m);
出力：
Array(3)
0: "apple"
1: "banana"
2: "orange"
length: 3
ご覧のとおり、配列はアルファベット順に並べ替えられ、結果は変数 m に保存されます。オブジェクトの配列がある場合は、sort() 関数を使用して配列を並べ替える前に、いくつかの条件を使用する必要があります。たとえば、一部の人の名前と名前を含むオブジェクトの配列があり、その人の名前に従って配列を並べ替えたい場合です。sort() 関数内に関数を渡す必要があります。この関数は、各人の名前を比較します。最初の人の名前が 2 番目の人の名前よりも小さい場合、関数は a を返します。負の値であり、それより大きい場合、関数は正の値を返します。両方が等しい場合、関数はゼロを返します。以下のコードを参照してください。
var a = [
{FirsName: 'Ellie', LastName: 'Williams'},
{FirstName: 'Lara', LastName: 'Croft'}
];
function SortArray(x, y) {
if (x.LastName < y.LastName) {
return -1;
}
if (x.LastName > y.LastName) {
return 1;
}
return 0;
}
var s = a.sort(SortArray);
console.log(s);
出力：
(2) [{…}, {…}]
0: {FirstName: "Lara", LastName: "Croft"}
1: {FirsName: "Ellie", LastName: "Williams"}
length: 2
ご覧のとおり、配列は姓に従ってソートされています。配列内のオブジェクトの数を増やすこともできます。名に従って配列をソートすることもできます。
JavaScript の localeCompare() および sort() 関数を使用して、オブジェクトの配列をアルファベット順に並べ替える
if 条件を使用する代わりに、localeCompare() 関数を使用して文字列を比較することもできます。関数内で設定できる比較用の他の多くのオプションを提供します。たとえば、localeCompare() 関数を使用して、上記のオブジェクトの配列を比較してみましょう。以下のコードを参照してください。
var a = [
{FirsName: 'Ellie', LastName: 'Williams'},
{FirstName: 'Lara', LastName: 'Croft'}
];
function SortArray(x, y) {
return x.LastName.localeCompare(y.LastName);
}
var s = a.sort(SortArray);
console.log(s);
出力：
(2) [{…}, {…}]
0: {FirstName: "Lara", LastName: "Croft"}
1: {FirsName: "Ellie", LastName: "Williams"}
length: 2
出力は上記の方法と同じです。比較中に句読点や特殊文字を無視するように関数を設定することもできます。たとえば、人の姓の前に句読点がある場合、関数は配列を並べ替えません。この場合、localeCompare() 関数を使用して、比較中に句読点を無視するように設定できます。以下のコードを参照してください。
var a = [
{FirsName: 'Ellie', LastName: ',Williams'},
{FirstName: 'Lara', LastName: 'Croft'}
];
function SortArray(x, y) {
return x.LastName.localeCompare(y.LastName, 'fr', {ignorePunctuation: true});
}
var s = a.sort(SortArray);
console.log(s);
出力：
(2) [{…}, {…}]
0: {FirstName: "Lara", LastName: "Croft"}
1: {FirsName: "Ellie", LastName: ",Williams"}
length: 2
句読点が存在する場合でも、配列は姓に従ってソートされます。以下に示すように、localeCompare() 関数の感度を base に設定することにより、文字列に特殊文字が存在する場合は無視することもできます。
x.LastName.localeCompare(y.LastName, 'en', {sensitivity: 'base'});
localeCompare() 関数の詳細については、このリンクを確認してください。
JavaScript の Collator() および sort() 関数を使用して、オブジェクトの配列をアルファベット順に並べ替える
if 条件を使用する代わりに、Collator() 関数を使用して文字列を比較することもできます。たとえば、Collator() 関数を使用して、上記のオブジェクトの配列を比較してみましょう。以下のコードを参照してください。
const collator = new Intl.Collator('en');
var a = [
{FirsName: 'Ellie', LastName: 'Williams'},
{FirstName: 'Lara', LastName: 'Croft'}
];
function SortArray(x, y) {
return collator.compare(x.LastName, y.LastName);
}
var s = a.sort(SortArray);
console.log(s);
出力：
(2) [{…}, {…}]
0: {FirstName: "Lara", LastName: "Croft"}
1: {FirsName: "Ellie", LastName: "Williams"}
length: 2
出力は上記の方法と同じです。collator.compare() 関数の 2つの引数の場所を変更することにより、ソート順を降順に変更することもできます。Collator() 関数を使用して、異なる言語の文字列を比較することもできます。その言語で collator オブジェクトを初期化する必要があります。たとえば、上記のコードでは、英語に en を使用しました。Collator() 関数の詳細については、このリンクを確認してください。
