目录
1、arr.sort()基本理解
2、错误思想
3、返回顺序不正确的原因
4、正确实现
升序和降序的实现
对象数组排序
对非ASCII字符排序
使用映射改善排序
1、arr.sort()基本理解
- arr.sort([compareFunction])此方法对数组元素进行排序
2、错误思想
在我们一般学习印象中sort函数可以直接对数组进行从小到大的默认排序。但是在一次动手输出的过程中,我发现此函数并没有按照预期将数组进行小到大的排序
//未正确排序的例子 -- 将其进行排序,但是未按小到大进行排序
var a = [4,2,56,13,5,2,33,11,4,5,6,7]
a.sort()
输出结果: [11, 13, 2, 2, 33, 4, 4, 5, 5, 56, 6, 7]
3、返回顺序不正确的原因
- 当函数compareFunction省略时,则元素按照转换为的字符串的各个字符的Unicode位点进行排序 -- 将数组中的数字逐个转换为字符串,得到['4','2','56','13','5','2','33','11','4','5','6','7']。再按照首位字符的Unicode位点计算。1的编码在3之前,所以10和14排在3之后。4在5之前,所以44排在5之前
- 如果首位字符的编码相同,则比较第二位字符的编码,比如 10 排在了 14之前(0 和 4 的比较结果)
4、正确实现
//正确排序的例子 -- 添加函数后实现小到大的排序
const arr = [2,3,11,4,3,542,222,8456,2121,0908,19999]
arr.sort((a,b) => a - b)
输出结果:[2, 3, 3, 4, 11, 222, 542, 908, 2121, 8456, 19999]
//此时数组相对于原数组进行改变
此时arr输出为:[2, 3, 3, 4, 11, 222, 542, 908, 2121, 8456, 19999]
升序和降序的实现
升序返回数组:arr.sort((a,b) => a - b)
降序返回数组:arr.sort((a,b) => b - a)
对象数组排序
var items = [
{name: 'Edward', value: 21},
{name: 'Sharpe', value: 37},
{name: 'And', value: 45},
{name: 'The', value: -12},
{name: 'Magnetic'},
{name: 'Zeros', value: 37}
];
// sort by value
items.sort(function (a, b) {
return (a.value - b.value)
});
//按照sort by value进行排序输出的结果
[
{name: 'The', value: -12}
{name: 'Edward', value: 21}
{name: 'Sharpe', value: 37}
{name: 'And', value: 45}
{name: 'Magnetic'}
{name: 'Zeros', value: 37}
]
// sort by name
items.sort(function (a, b) {
var nameA = a.name.toUpperCase(); // ignore upper and lowercase
var nameB = b.name.toUpperCase(); // ignore upper and lowercase
if (nameA < nameB) {
return -1;
}
if (nameA > nameB) {
return 1;
}
// names must be equal
return 0;
});
//按照sort by name进行排序输出的结果
[
{name: 'And', value: 45}
{name: 'Edward', value: 21}
{name: 'Magnetic'}
{name: 'Sharpe', value: 37}
{name: 'The', value: -12}
{name: 'Zeros', value: 37}
]
对非ASCII字符排序
一些非英文的字符串进行排序们需要使用String.localeCompare函数进行排序
var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
items.sort(function (a, b) {
return a.localeCompare(b);
});
// 输出结果: items is ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
使用映射改善排序
当元素多时,函数会有很大的负载。使用map进行辅助完成
//map辅助的原理:将数组中的每个元素比较的实际值取出来进行排序,排序完成之后再将数组进行恢复
// 需要被排序的数组
var list = ['Delta', 'alpha', 'CHARLIE', 'bravo'];
// 对需要排序的数字和位置的临时存储
var mapped = list.map(function(el, i) {
return { index: i, value: el.toLowerCase() };
})
// 按照多个值排序数组
mapped.sort(function(a, b) {
return +(a.value > b.value) || +(a.value === b.value) - 1;
});
// 根据索引得到排序的结果
var result = mapped.map(function(el){
return list[el.index];
});
借鉴链接:
JavaScript 中数组 sort() 方法的基本使用 - 掘金 (juejin.cn)
|