根据某个属性将对象排序

在实际的应用场景中我们可能会遇到这样的现象：

从后台请求得到一个数组，数组中的每一项都是对象，需要你根据对象的某个属性名将对象进行排序。例如根据首字母对省份地区的排序，根据学号对学生进行排序等。

大概举例如下：

var arr = [
    {name: 'lzl', age: 22, id: 1552440205},
    {name: 'amd', age: 15, id: 1345150504},
    {name: 'fsm', age: 18, id: 1542559322},
]

你会如何处理呢？

在正式开始前，可能还需要补充以下知识点：

arr.sort()对数组中的元素进行排序，默认为按照ASCII进行排序。

(1)将数组中的元素升序排列(从小到大)

arr.sort(function (a, b) {
    return a - b;
})

(2)降序排列

arr.sort(function (a, b) {
    return b - a;
})

具体的可以查看上一篇中关于数组sort方法的具体介绍。

根据age属性排序

基于以上，如果想要按照age属性对数组中的元素进行排序时，具体代码如下：

arr.sort(function (a, b) {
    return a.age - b.age;
})

console.log(arr);

输出结果如下：

根据用户传入的属性排序

如果想要根据用户传入的某个属性直接进行排序，具体实现如下：

function propSort(prop) {
    return function (obj1, obj2) {
        return obj1[prop] - obj2[prop];
    }
}
var newArr = arr.sort(propSort('id'));      //调用方法
console.log(newArr);

输出结果如下：

调用上面方法时，取到的属性值都是数字，此时结果是正确的。那如果属性值是字符串时，结果会如何呢？

分析方法可以知道，obj1[prop]取到的是字符串，此时’-‘号两边都是字符串，有隐式类型转换，相当于NaN - NaN, 返回的值还是NaN。无法判断等号两边的数值大小。

于是该方法可以做以下修改：

function sortBy (prop) {
    return function (obj1, obj2) {
        var str1 = obj1[prop];
        var str2 = obj2[prop];
        if(str1 > str2) {
            return 1;
        }else {
            return -1;
        }
    }
}

var newArr = arr.sort(sortBy('name'));      //调用方法
console.log(newArr);

输出结果如下：

以上方法同样适用于当属性值是数值时将数组进行排序。

当function返回值为负数时，两个相比较的数，前面的数在前(两个数不交换顺序);
当function返回值为正数时，两个相比较的数，后面的数在前(两个数要交换顺序)。

封装方法

根据传入的参数来进行判断是升序排列还是降序排列，封装方法如下：

function sortBy (prop, flag) {
      if (flag) {
            flag = -1;
      }else {
            flag = 1;
      }
    return function (obj1, obj2) {
        var str1 = obj1[prop];
        var str2 = obj2[prop];
        if(str1 > str2) {
            return  1 * flag;
        }else {
            return -1  * flag;
        }
    }
}

var newArr = arr.sort(sortBy('name', true));      //调用方法
console.log(newArr);

输出结果如下：

该方法默认为升序排列，当不传入数值或者传入的值为假时，为升序排列；否则为降序排列。

忽略字符大小写排序

当字符串中同时含有大小写，且需要忽略字母大小写进行排序时，可以调用toLowerCase()方法将字母全部转化为小写

修改代码如下:

function sortBy (prop) {
    return function (obj1, obj2) {
        var str1 = obj1[prop].toLowerCase();
        var str2 = obj2[prop].toLowerCase();
        if(str1 > str2) {
            return 1;
        }else {
            return -1;
        }
    }
}

var newArr = arr.sort(sortBy('name'));      //调用方法
console.log(newArr);

输出结果如下：

根据多个属性排序

假设某个属性相等的情况下，我们是否能根据另外一个属性来对数组进行排序呢？

答案当然是肯定的，模拟数据如下：

var arr = [
    {name: 'lzl', age: 22, id: 1552440205},
    {name: 'amd', age: 15, id: 1345150504},
    {name: 'fsm', age: 18, id: 1542559322},
    {name: 'pmd', age: 18, id: 1234567895},
    {name: 'abb', age: 22, id: 1512559320},
    {name: 'slg', age: 22, id: 1552440220},
]

具体实现方法：

function sortBy(prop1, prop2) {
    return function (a, b) {
        if(a[prop1] === b[prop1]) {
            return a[prop2] - b[prop2];
        }else {
            return a[prop1] - b[prop1];
        }
    }
}

var newArr = arr.sort(sortBy('age', 'id'));
console.log(newArr);

输出结果如图：