JavaScript 中通过Array.sort() 实现多字段排序、排序稳定性、随机排序洗牌算法、优化排序性能，JS中排序算法的使用详解（附实际应用代码）

JavaScript 中通过Array.sort() 实现多字段排序、排序稳定性、随机排序（洗牌算法）、优化排序性能等，JS中排序算法的使用详解（附实际应用代码）

一、为什么要使用Array.sort()

Array.sort() 是 JavaScript 中用于数组排序的内置方法。表面上看，它只是一个对数组元素进行升序或降序排列的工具，但深入理解其用法后会发现，它不仅支持灵活的排序逻辑，还能结合其他数组方法，实现复杂的数据操作和优化性能。本文将从基本语法入手，逐步讲解 Array.sort() 的复杂用法，并通过丰富的实战案例，展示其在开发中的强大应用。

二、Array.sort() 的使用与技巧

1、基础语法

Array.sort() 方法用于对数组中的元素进行原地排序，并返回排序后的数组。默认情况下， sort () 会将数组元素转换为字符串并按字典序排序 。

array.sort([compareFunction]);

compareFunction（可选）：用于定义排序顺序的函数。它接收两个参数 a 和 b：

• 如果返回值 < 0，则 a 排在 b 前面。
• 如果返回值 > 0，则 b 排在 a 前面。
• 如果返回值为 0，则两者位置保持不变。

2、返回值

Array.sort() 会按照比较器的规则修改原数组，直至排序完成，不会产生新的数组。

3、使用技巧

Array.sort() 的核心其实就是比较函数，大多数时候需要我们自己写一个满足实际需求的比较函数。

如果直接比较数字数组排序，会出现"10"<"6"之类的情况，因为在字符串中是先比较第一位，再往后逐步推进，“1”在字符串中在“6”前面，"1"<"6"，就不会再比较第二位了，所以"10"<"6"。

这里举个例子：

const numbers = [25, 100, 9, 2];
numbers.sort();
console.log(numbers); 
// 输出：[100, 2, 25, 9] （按照字典序排序）

const numbers = [25, 100, 9, 2];
numbers.sort((a, b) => a - b); // 升序排序
console.log(numbers); 
// 输出：[2, 9, 25, 100]

const users = [
  { name: 'Alice', age: 25, role: 'user' },
  { name: 'Bob', age: 22, role: 'admin' },
  { name: 'Charlie', age: 35, role: 'user' },
  { name: 'Dave', age: 30, role: 'admin' },
// 按角色升序，角色相同时按年龄升序
users.sort((a, b) => {
  if (a.role === b.role) {
    return a.age - b.age; // 按年龄升序
  return a.role.localeCompare(b.role); // 按角色字典序
console.log(users);
  { name: 'Bob', age: 22, role: 'admin' },
  { name: 'Dave', age: 30, role: 'admin' },
  { name: 'Alice', age: 25, role: 'user' },
  { name: 'Charlie', age: 35, role: 'user' }
*/

const events = [
  { name: 'Event A', date: '2024-11-20' },
  { name: 'Event B', date: '2023-12-25' },
  { name: 'Event C', date: '2024-01-01' },
events.sort((a, b) => new Date(a.date) - new Date(b.date));
console.log(events);
  { name: 'Event B', date: '2023-12-25' },
  { name: 'Event C', date: '2024-01-01' },
  { name: 'Event A', date: '2024-11-20' }
*/

const items = [
  { name: 'Apple', weight: 3 },
  { name: 'Banana', weight: 1 },
  { name: 'Cherry', weight: 1 },
items.sort((a, b) => a.weight - b.weight);
console.log(items);
  { name: 'Banana', weight: 1 },
  { name: 'Cherry', weight: 1 },
  { name: 'Apple', weight: 3 }
*/

const array = [1, 2, 3, 4, 5];
array.sort(() => Math.random() - 0.5);
console.log(array);
// 输出：随机排列的数组，例如：[3, 1, 5, 2, 4]

const data = [
  { name: 'Alice', score: 90 },
  { name: 'Bob', score: 75 },
  { name: 'Charlie', score: 95 },
// 1. 生成映射
const mapped = data.map((item, index) => ({ index, value: item.score }));
// 2. 排序
mapped.sort((a, b) => b.value - a.value); // 按分数降序
// 3. 根据映射还原
const result = mapped.map(m => data[m.index]);
console.log(result);
  { name: 'Charlie', score: 95 },
  { name: 'Alice', score: 90 },
  { name: 'Bob', score: 75 }
*/

const filenames = ['file1.txt', 'file20.txt', 'file3.txt'];
filenames.sort((a, b) => {
  const numA = parseInt(a.match(/\d+/)[0], 10);
  const numB = parseInt(b.match(/\d+/)[0], 10);
  return numA - numB;
console.log(filenames);
// 输出：['file1.txt', 'file3.txt', 'file20.txt']

const orders = [
  { id: 1, category: 'Electronics', total: 200 },
  { id: 2, category: 'Clothing', total: 50 },
  { id: 3, category: 'Electronics', total: 100 },
  { id: 4, category: 'Clothing', total: 75 },
// 按类别分组并排序
const groupedAndSorted = orders
  .sort((a, b) => a.category.localeCompare(b.category) || b.total - a.total)
  .reduce((groups, order) => {
    const { category } = order;
    groups[category] = groups[category] || [];
    groups[category].push(order);
    return groups;
  }, {});
console.log(groupedAndSorted);
  Clothing: [
    { id: 4, category: 'Clothing', total: 75 },
    { id: 2, category: 'Clothing', total: 50 }