# 如何在JavaScript中对对象数组进行排序

github 地址：https://github.com/qq44924588...

## 基本数组排序

``````const foo = [9, 1, 4, 'zebroid', 'afterdeck'];
foo.sort(); // returns [ 1, 4, 9, 'afterdeck', 'zebroid' ]

const bar = [5, 18, 32, new Set, { user: 'Eleanor Roosevelt' }];
bar.sort(); // returns [ 18, 32, 5, { user: 'Eleanor Roosevelt' }, Set {} ]``````

``````const baz = ['My cat ate my homework', 37, 9, 5, 17];
baz.sort(); // baz数组被修改
console.log(baz); // shows [ 17, 37, 5, 9, 'My cat ate my homework' ]``````

``````// 创建baz数组的新实例并对其进行排序
const sortedBaz = baz.slice().sort();``````

``const sortedBaz = [...baz].sort(); ``

``````console.log(baz); // ['My cat ate my homework', 37, 9, 5, 17];
console.log(sortedBaz); // [ 17, 37, 5, 9, 'My cat ate my homework' ]``````

## 使用比较函数进行排序

1. 小于`0``foo``bar`之前
2. 大于`0``bar``foo`之前
3. 等于`0``foo``bar`彼此保持不变。

``````const nums = [79, 48, 12, 4];

function compare(a, b) {
if (a > b) return 1;
if (b > a) return -1;

return 0;
}

nums.sort(compare);
// => 4, 12, 48, 79``````

``````function compare(a, b) {
return a - b;
}``````

``nums.sort((a, b) => a - b);``

## 如何对对象数组进行排序

``````const singers = [
{ name: 'Steven Tyler', band: 'Aerosmith', born: 1948 },
{ name: 'Karen Carpenter', band: 'The Carpenters', born: 1950 },
{ name: 'Kurt Cobain', band: 'Nirvana', born: 1967 },
{ name: 'Stevie Nicks', band: 'Fleetwood Mac', born: 1948 },
];``````

``````function compare(a, b) {
// 使用 toUpperCase() 忽略字符大小写
const bandA = a.band.toUpperCase();
const bandB = b.band.toUpperCase();

let comparison = 0;
if (bandA > bandB) {
comparison = 1;
} else if (bandA < bandB) {
comparison = -1;
}
return comparison;
}

singers.sort(compare);

/* returns [
{ name: 'Steven Tyler', band: 'Aerosmith',  born: 1948 },
{ name: 'Stevie Nicks', band: 'Fleetwood Mac', born: 1948 },
{ name: 'Kurt Cobain', band: 'Nirvana', born: 1967 },
{ name: 'Karen Carpenter', band: 'The Carpenters', born: 1950 }
] */``````

``````function compare(a, b) {
...

// 乘以-1来反转返回值
return comparison * -1;
}``````

## 创建一个动态排序函数

``````const singers = [
{ name: 'Steven Tyler', band: 'Aerosmith', born: 1948 },
{ name: 'Karen Carpenter', band: 'The Carpenters', born: 1950 },
{ name: 'Kurt Cobain', band: 'Nirvana', born: 1967 },
{ name: 'Stevie Nicks', band: 'Fleetwood Mac', born: 1948 },
];

function compareValues(key, order = 'asc') {
return function innerSort(a, b) {
if (!a.hasOwnProperty(key) || !b.hasOwnProperty(key)) {
// 该属性在任何一个对象上都不存在
return 0;
}

const varA = (typeof a[key] === 'string')
? a[key].toUpperCase() : a[key];
const varB = (typeof b[key] === 'string')
? b[key].toUpperCase() : b[key];

let comparison = 0;
if (varA > varB) {
comparison = 1;
} else if (varA < varB) {
comparison = -1;
}
return (
(order === 'desc') ? (comparison * -1) : comparison
);
};
}``````

``````//数组按`band`排序，默认为升序
singers.sort(compareValues('band'));

// 数组按 `band` 降序排序
singers.sort(compareValues('band', 'desc'));

// 数组按 `name` 升序排序
singers.sort(compareValues('name'));

// 数 组born 降序排序
singers.sort(compareValues('born', 'desc'));``````

`typeof`运算符还用于检查属性值的数据类型，这使函数可以确定对数组进行排序的正确方法。 如果指定属性的值是一个字符串，则使用`toUpperCase`方法将其所有字符都转换为大写，因此排序时将忽略字符大小写

## String.prototype.localeCompare()

• 如果 字符串 在 字母 表中 应该 排在 字符串 参数 之前， 则 返回 一个 负数；
• 如果 字符串 等于 字符串 参数， 则 返回 0；
• 字符串 在 字母 表中 应该 排在 字符串 参数 之后， 则 返回 一个 正数；
``````['bjork', 'Bjork', 'Björk'].sort();
// [ 'Bjork', 'Björk', 'bjork' ]

['bjork', 'Bjork', 'Björk'].sort((a, b) => a.localeCompare(b));
//  [ 'bjork', 'Bjork', 'Björk' ]``````

``````function compareValues(key, order = 'asc') {
return function innerSort(a, b) {
if (!a.hasOwnProperty(key) || !b.hasOwnProperty(key)) return 0;
const comparison = a[key].localeCompare(b[key]);

return (
(order === 'desc') ? (comparison * -1) : comparison
);
};
}``````

54.9k 声望
9.5k 粉丝
0 条评论