当前位置:首页 > JavaScript

js排序实现

2026-02-02 01:59:26JavaScript

JavaScript 数组排序基础

使用 Array.prototype.sort() 方法对数组进行排序。默认情况下,sort() 将元素转换为字符串并按 Unicode 码点排序:

const arr = [3, 1, 4, 2];
arr.sort(); // 输出: [1, 2, 3, 4](数字排序正确)
const strArr = ['banana', 'apple', 'cherry'];
strArr.sort(); // 输出: ['apple', 'banana', 'cherry']

自定义排序规则

通过传递比较函数实现复杂排序。比较函数接收参数 ab,返回负数、零或正数:

// 数字升序
const numbers = [10, 2, 5];
numbers.sort((a, b) => a - b); // 输出: [2, 5, 10]

// 数字降序
numbers.sort((a, b) => b - a); // 输出: [10, 5, 2]

// 对象数组按属性排序
const users = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 20 }
];
users.sort((a, b) => a.age - b.age); // 按 age 升序

字符串排序的本地化支持

使用 localeCompare() 处理语言敏感的字符串排序(如忽略大小写或特定语言规则):

const fruits = ['Apple', 'banana', 'Cherry'];
fruits.sort((a, b) => a.localeCompare(b, undefined, { sensitivity: 'base' }));
// 输出: ['Apple', 'banana', 'Cherry'](不区分大小写)

稳定排序的实现

ES2019 后 sort() 稳定,但如需兼容旧环境,可通过索引保持稳定性:

const data = [
  { value: 2, priority: 1 },
  { value: 1, priority: 1 },
  { value: 3, priority: 2 }
];
// 添加索引辅助稳定排序
data.forEach((item, index) => item.index = index);
data.sort((a, b) => 
  a.priority - b.priority || a.index - b.index
);
// 相同 priority 的元素保持原始顺序

复杂多条件排序

结合多个属性或条件进行排序:

js排序实现

const tasks = [
  { title: 'Task A', priority: 'high', due: '2023-10-01' },
  { title: 'Task B', priority: 'low', due: '2023-09-01' }
];
tasks.sort((a, b) => {
  const priorityOrder = { high: 1, medium: 2, low: 3 };
  return (
    priorityOrder[a.priority] - priorityOrder[b.priority] ||
    new Date(a.due) - new Date(b.due)
  );
});
// 先按 priority 升序,再按日期升序

性能注意事项

  • 大规模数据排序时,考虑使用 TypedArray 或 Web Worker 避免阻塞主线程。
  • 对固定结构数据,预处理(如生成排序键)可能提升效率。

标签: js
分享给朋友:

相关文章

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previo…

js实现点击显示和隐藏

js实现点击显示和隐藏

实现点击显示和隐藏的JavaScript方法 使用classList.toggle切换类名 通过添加/移除CSS类控制元素的显示与隐藏,需提前在CSS中定义隐藏样式(如display: none)。…

链表实现js

链表实现js

链表的基本概念 链表是一种线性数据结构,由一系列节点组成,每个节点包含数据和一个指向下一个节点的指针(单向链表)或两个指针(双向链表)。与数组不同,链表在内存中非连续存储,插入和删除操作更高效,但随机…

js实现搜索

js实现搜索

实现搜索功能的方法 在JavaScript中实现搜索功能可以通过多种方式完成,以下是几种常见的实现方法。 使用数组的filter方法 通过数组的filter方法可以筛选出符合条件的数据项。假设有一个…

js实现的游戏

js实现的游戏

JavaScript 游戏开发基础 JavaScript 是开发网页游戏的流行选择,因其无需插件即可在浏览器中运行。以下是一些关键技术和资源: HTML5 Canvas Canvas 提供了绘制图形…

js实现复选框

js实现复选框

实现复选框的基本方法 使用HTML的<input type="checkbox">元素创建复选框,并通过JavaScript监听其状态变化。 <input type="checkb…