举例说明数组的排序方法有哪些?

在前端开发中,JavaScript 提供了几种数组排序方法,各有优缺点:

1. sort() 方法 (原生)

这是 JavaScript 原生的数组排序方法。它会直接修改原数组。

  • 用法: array.sort([compareFunction])

  • 说明:

    • 可选的 compareFunction 用于自定义排序逻辑。如果不提供,sort() 会将元素转换为字符串,然后按照 Unicode 码点进行排序 (字典序)。这会导致 10 排在 2 前面,因为 "10" 的首字符 "1""2" 小。
    • compareFunction 接收两个参数 ab,并返回一个数字:
      • 若返回负数,则 a 排在 b 前面。
      • 若返回正数,则 b 排在 a 前面。
      • 若返回 0,则 ab 的相对顺序不变。
  • 例子:

const numbers = [3, 1, 4, 1, 5, 9, 2, 6];

// 默认排序 (字符串比较):
numbers.sort(); // [1, 1, 2, 3, 4, 5, 6, 9]  (注意: 实际结果可能是 [1, 1, 2, 3, 4, 5, 6, 9], 因为数字被转换成字符串比较)

// 数值排序:
numbers.sort((a, b) => a - b); // [1, 1, 2, 3, 4, 5, 6, 9]

// 逆序排序:
numbers.sort((a, b) => b - a); // [9, 6, 5, 4, 3, 2, 1, 1]

const fruits = ['apple', 'banana', 'Apple', 'orange'];

// 默认排序 (Unicode 码点):
fruits.sort(); // ['Apple', 'apple', 'banana', 'orange'] (区分大小写)

// 不区分大小写的排序:
fruits.sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase())); // ['apple', 'Apple', 'banana', 'orange']

2. localeCompare() 方法 (用于字符串)

专门用于比较字符串,并考虑本地化排序规则 (例如不同语言的字母顺序)。

  • 用法: stringA.localeCompare(stringB)

  • 例子: 见上面 fruits 的不区分大小写排序的例子。

3. 外部库 (Lodash)

Lodash 等库提供了更丰富的排序功能,例如按对象的属性排序。

  • 例子:
const users = [
  { name: 'Alice', age: 30 },
  { name: 'Bob', age: 25 },
  { name: 'Charlie', age: 35 }
];

// 使用 Lodash 按年龄排序:
const sortedUsers = _.sortBy(users, 'age'); // [{ name: 'Bob', age: 25 }, { name: 'Alice', age: 30 }, { name: 'Charlie', age: 35 }]

选择哪种方法?

  • 对于简单的数值或字符串数组,sort() 方法通常足够。
  • 对于需要考虑本地化排序规则的字符串,使用 localeCompare()
  • 对于复杂的对象数组或需要更多排序选项,可以考虑使用 Lodash 等外部库。

重要提示: sort() 方法会直接修改原数组。如果需要保留原数组,请先复制一份:

const originalArray = [3, 1, 4, 1, 5];
const newArray = [...originalArray].sort((a, b) => a - b); // newArray 是排序后的数组,originalArray 保持不变
posted @   王铁柱6  阅读(14)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 全程不用写代码,我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
点击右上角即可分享
微信分享提示