JS 解决sort字母排序的问题

前言

前些天写bug的时候,需要对数组按字母进行排序,就想到了 sort ,没想到还给了我个惊(jing)喜(xia)

还原事故现场

数组:[{letter: ‘a’}, {letter: ‘c’}, {letter: ‘b’}, {letter: ‘d’}]

需要按数组元素的 letter 属性来排序,吓得我赶紧掏出了我的24K合金键盘来,三下五除二的写出了 sort 排序:

let arr = [{letter: 'a'}, {letter: 'c'}, {letter: 'b'}, {letter: 'd'}]
arr.sort((a, b) => a.letter - b.letter)
// 运行: [{letter: 'a'}, {letter: 'c'}, {letter: 'b'}, {letter: 'd'}]

一运行发现,啥变化也没有。

后来查了下,找到了正解

sort 默认是根据每个元素的 ASCII 码进行排序,排序的核心是对比两个元素的大小,直接对比数字是可以的,那么如果元素是字符串或对象呢?这时候去对比它们数字上的大小是没有意义的

对比规则如下:

  • 如果 a - b 是负数,也就是 a < b , 那么 a 在前面,返回 -1。
  • 如果 a - b 是正数,也就是 a > b , 那么 b 在前面,返回 1
  • 如果两个相等,那就啥也不干,返回 0

既然找到了问题所在,那就开始 improve 吧

let arr= [{letter: 'a'}, {letter: 'c'}, {letter: 'b'}, {letter: 'd'}]
arr.sort((a, b) => {
  if (a.letter < b.letter) {
    return -1
  }

  if (a.letter > b.letter) {
    return 1
  }

  return 0
})
// 运行:[{letter: 'a'}, {letter: 'b'}, {letter: 'c'}, {letter: 'd'}]

问题是解决了,不过这代码看起来好low的样子,那咱就换个写法吧~

arr.sort((a, b) => a.letter < b.letter ? -1 : a.letter > b.letter ? 1 : 0);
// 运行:[{letter: 'a'}, {letter: 'b'}, {letter: 'c'}, {letter: 'd'}]

完美~

点我查看更多文章

对于JS中的英文字母排序,可以使用sort()方法来实现。其中,根据英文首字母进行排序的方法如下所示: ```javascript arr1.sort(function(a, b) { return (a.name.toLowerCase()).localeCompare(b.name.toLowerCase()); }); console.log(arr1); ``` 这段代码将根据英文字母首字母进行升序排序,并使用localeCompare()方法进行比较。它会忽略大小写,确保在排序过程中能正确地排列英文字母。 另外,如果你需要进行多次排序,可以使用multipleSort()方法,如下所示: ```javascript var data = [{ a: 1, b: 'a' }, { a: 2, b: 'c' }, { a: 2, b: 'b' }]; var sorts = [{ key: 'a', order: 'desc' }, { key: 'b', order: 'asc' }]; function multipleSort(data, sorts) { sorts.reverse().forEach(sort => { data.sort(compare(sort.key, sort.order)); }); function compare(key, order) { return function(m, n) { var value1 = typeof(m[key]) == "number" ? m[key] : m[key].charCodeAt(); var value2 = typeof(n[key]) == "number" ? n[key] : n[key].charCodeAt(); if (order === 'desc') return value2 - value1; else return value1 - value2; } } return data; } console.log(multipleSort(data, sorts)); ``` 这段代码可以对指定对象中的某个字段进行排序,同时支持按照升序或降序进行排列。你可以根据自己的需求修改数组和排序规则。需要注意的是,对于字段值为字母的情况,可以将字母转换为ASCII码进行处理,也可以截取首字母后再转换为ASCII码来排序。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [JS数组对象——英文按照首字母进行排序sort()、localeCompare()](https://blog.csdn.net/XSL_HR/article/details/128579936)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [jssort()字母排序和自定义多列排序](https://blog.csdn.net/qq_34241004/article/details/114464189)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值