数组排序之优雅的compare函数

JavaScript数组排序,默认支持两种:sort()排序和reverse()逆序。

reverse()

reverse()没什么好介绍的,就是把数组反转一下。

var arr = [2, 1, 3, 7, 12, 17]
arr.reverse() // [17, 12, 7, 3, 1, 2]

// 类似于
var arr = [2, 1, 3, 7, 12, 17]
var tmp = []
var len = arr.length
for (var i=0; i<len; i++) {
    tmp.push(arr.pop())
}
arr = tmp

sort() & 优雅的写compare函数

sort()有两个重点:

  • 排序方法比较的是字符串
  • 排序方法可以自定义compare函数

compare函数很重要,是sort()的精髓,因为它sort()才变得好用。它可以实现:降序排序、数字排序、数组元素为对象且以对象某字段排序...

// 比较的是字符串 --1--
var arr = [2, 1, 3, 7, 12, 17]
arr.sort() //[1, 12, 17, 2, 3, 7]

// 自定义compare函数
// 比较数字 - 以数据大小定顺序 --2--
var arr = [2, 1, 3, 7, 12, 17]
var compare = function(item1, item2) {
    if(Number(item1) < Number(item2)) { 
        return -1 // 升序排序-1,降序排序1
    } else if (Number(item1) > Number(item2)) {
        return 1 // 升序排序1,降序排序-1
    } else {
        return 0 // 相等返回0
    }
}
arr.sort(compare) //[1, 2, 3, 7, 12, 17]

// 数组元素为对象(sort()将无法排序),并以对象的某个属性排序 --3--
var arr = [
    {
        name: 'luwuer',
        age: '18'
    },
    {
        name: 'cc',
        age: '23'
    },
    {
        name: 'bili',
        age: '8'
    }
]
var compareContainer = function(attr) {
    // return的匿名函数才是compare函数喲
    return function(item1, item2) {
        var value1 = isNaN(Number(item1[attr]))? item1[attr]: Number(item1[attr])
        var value2 = isNaN(Number(item2[attr]))? item2[attr]: Number(item2[attr])
        if (value1 < value2) {
            return -1
        } else if (value1 > value2) {
            return 1
        } else {
            return 0
        }
    }
}
arr.sort(compareContainer('age')) // 试试结果咯
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 8,862评论 0 4
  • php usleep() 函数延迟代码执行若干微秒。 unpack() 函数从二进制字符串对数据进行解包。 uni...
    思梦PHP阅读 6,177评论 1 24
  • 第三章 数组 数组是一个可以存储一组或一系列数值的变量 一个包含其他数组的数组称为多维数组。 关联数组允许使用更...
    梁烨端木阅读 4,138评论 0 0
  • PHP有很多关于数组的函数,方便数组操作。 定义 数组每个实体包含两个项:key和value,可以通过查询键来获取...
    天承本草2020阅读 2,844评论 0 0
  • PHP常用函数大全 usleep() 函数延迟代码执行若干微秒。 unpack() 函数从二进制字符串对数据进行解...
    上街买菜丶迷倒老太阅读 5,249评论 0 20

友情链接更多精彩内容