有些时候需要前端进行来排序，排序的时候通常需要对同时包含：数字、字母、中文的对象进行排序；
let data = [
{name: ‘张三’,age: 12},
{name: ‘张三’,age: 12}
]
data.sort( // 第一种方式
(a, b) => this.sortDevName(a['name'], b['name'])
);
data.sort( // 第二种方式 - 仅支持中文
(a, b) => return a['name'].localeCompare(b['name']);
);
（1）第一种方式
在methods中定义：
排序顺序为：数字（0->9）->大写字母（A->Z）->小写字母（a->z）->中文拼音（a->z）
sortDevName(str1, str2) {
let res = 0;
for (let i = 0; ;i += 1) {
if (!str1[i] || !str2[i]) {
res = str1.length - str2.length;
break;
}
const char1 = str1[i];
const char1Type = this.getChartType(char1);
const char2 = str2[i];
const char2Type = this.getChartType(char2); // 类型相同的逐个比较字符
if (char1Type[0] === char2Type[0]) {
if (char1 === char2) {
break;
}
if (char1Type[0] === 'zh') {
res = char1.localeCompare(char2);
} else if (char1Type[0] === 'en') {
res = char1.charCodeAt(0) - char2.charCodeAt(0);
} else {
res = char1 - char2;
}
break;
} else { // 类型不同的，直接用返回的数字相减
res = char1Type[1] - char2Type[1];
break;
}
}
return res;
},
getChartType(char) {
// 数字可按照排序的要求进行自定义，我这边产品的要求是
// 数字（0->9）->大写字母（A->Z）->小写字母（a->z）->中文拼音（a->z）
if (/^[\u4e00-\u9fa5]$/.test(char)) {
return ['zh', 300];
}
if (/^[a-zA-Z]$/.test(char)) {
return ['en', 200];
}
if (/^[0-9]$/.test(char)) {
return ['number', 100];
}
return ['others', 999];
},
（2）第二种方式
localeCompare() 方法来实现中文按照拼音排序，貌似仅仅支持中文排序。
把 < 和 > 运算符应用到字符串时，它们只用字符的 Unicode 编码比较字符串，而不考虑当地的排序规则。以这种方法生成的顺序不一定是正确的
网友评论