JS 多字段(多条件)排序问题以及字符串排序方法

js实现数组的多条件排序

其实这种排序在后台做一个order by 啥的就解决了 但是前端做也是可以的.

需求是这样的 例如有这样一个数组给你排序
const jsonStudents = [
{name:"张三", totalScore:"197", Chinese:"100",math:"97"},
{name:"李二", totalScore:"196",Chinese:"99", math:"97"},
{name:"赵四", totalScore:"195",Chinese:"99", math:"10"},
{name:"艾一", totalScore:"195",Chinese:"96", math:"80"},
{name:"毕福剑", totalScore:"185", Chinese:"88", math:"97"},
{name:"李二", totalScore:"196", Chinese:"96",math:"100"},
{name:"李二", totalScore:"196", Chinese:"98",math:"98"},
{name:"王五", totalScore:"198", Chinese:"99",math:"99"}];

这样我们要先按照姓名排序 如果姓名相同按照totalSorce排序,如果总分也一样那就按Chinese排序.

---

首先想到的肯定是字符串的排序方法 sort()

let a = [6,5,7,2,6,45,5]
        a.sort(function(a,b){
            return a- b
        })
        console.log(a)//[2, 5, 5, 6, 6, 7, 45]

sort()方法接受一个比较函数 返回 负数 0 或 正数 (这个可以看看w3choole)

但是

let arr = ["张三","王五","艾一","王埃竹"]
        arr.sort(function(a,b){
            return a-b;
        })
        console.log(arr)//["张三", "王五", "艾一", "王埃竹"]

完全没排序啊

然后我发现了一个方法 localeCompare()

let arr = ["张三","王五","艾一","王埃竹"]
        arr.sort(function(a,b){
            return a.localeCompare(b);
        })
        console.log(arr)//["艾一", "王埃竹", "王五", "张三"]

这回就好用了 可是有的时候会发生 ‘王五’ 在前… 这个问题其实可以使用localeCompare的第二个参数来解决 ,就是这样

return a.localeCompare(b,'zh-CN');

我们指定为简体汉字 这样就不会错了. 按这个思路那么其他语言也可以排序了呢.

const jsonStudents = [
            {name:"きあいのタスキ", totalScore:"197", Chinese:"100",math:"97"},
            {name:"あぃまさｎ", totalScore:"196",Chinese:"99", math:"97"},
            {name:"いいいぇ", totalScore:"195",Chinese:"99", math:"10"},
            {name:"いいいぇ", totalScore:"195",Chinese:"96", math:"80"},
            {name:"いいいぇ", totalScore:"185", Chinese:"88", math:"97"},
            {name:"かまでい", totalScore:"196", Chinese:"96",math:"100"},
            {name:"佐藤", totalScore:"196", Chinese:"98",math:"98"},
            {name:"高橋", totalScore:"198", Chinese:"99",math:"99"}];
        // 这句话没啥用是一个深拷贝 为了显示原来的 数组 (sort好像会改变原数组)
        let before = JSON.parse(JSON.stringify(jsonStudents))
        jsonStudents.sort(function(a,b){
            var value1 = a.name,
                value2 = b.name;
            if(value1 !== value2){
                return value1.localeCompare(value2,'ja');
            }else if(a.totalScore!== b.totalScore){
                return a.totalScore -b.totalScore;
            }else{
                return a.Chinese - b.Chinese;
            }


        })
        console.log(before)
        console.log(jsonStudents)

这个我也不知道日语怎么排序 大概是按 五十音图排的 あ　い　う　え　お　
其中”ja” 对应日语 中文对应的是 “zh-CN” 英语是”US” “en-US”
关于localeCompare方法还有很多参数 这个是具体的介绍可以参考一下
等到用到在更新