当前位置:首页 > JavaScript

js实现列表排序

2026-02-02 23:20:58JavaScript

使用 Array.prototype.sort()

JavaScript 数组的 sort() 方法默认按 Unicode 码点排序,可能不符合数值或自定义排序需求。需传入比较函数实现定制排序。

const numbers = [3, 1, 4, 1, 5];
numbers.sort((a, b) => a - b); // 升序 [1, 1, 3, 4, 5]
numbers.sort((a, b) => b - a); // 降序 [5, 4, 3, 1, 1]

对象数组按属性排序

对于对象数组,可通过比较函数指定属性排序:

const users = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 }
];
users.sort((a, b) => a.age - b.age); // 按 age 升序

字符串排序

字符串排序需考虑大小写或本地化规则:

const fruits = ['Banana', 'apple', 'Cherry'];
fruits.sort((a, b) => a.localeCompare(b)); // 忽略大小写排序

稳定排序实现

ES2019 后 sort() 已稳定,但如需兼容旧环境可手动实现稳定排序:

function stableSort(array, compare) {
  const indexed = array.map((v, i) => [v, i]);
  indexed.sort((a, b) => compare(a[0], b[0]) || a[1] - b[1]);
  return indexed.map(v => v[0]);
}

按多条件排序

通过组合比较条件实现多级排序:

js实现列表排序

const data = [
  { name: 'Alice', age: 25, score: 80 },
  { name: 'Bob', age: 25, score: 90 }
];
data.sort((a, b) => 
  a.age - b.age || b.score - a.score
); // 先按 age 升序,再按 score 降序

标签: 列表js
分享给朋友:

相关文章

vue实现无线滚动列表

vue实现无线滚动列表

无限滚动列表的实现方法 无限滚动列表通常用于展示大量数据,通过动态加载数据减少初始渲染压力。以下是基于Vue的实现方法: 使用Intersection Observer API监听滚动 Inters…

js实现验证码

js实现验证码

使用Canvas生成图形验证码 在HTML中创建一个Canvas元素用于绘制验证码。通过JavaScript随机生成数字或字母组合,并添加干扰线、噪点等干扰元素增强安全性。 <canvas i…

js防抖和节流实现

js防抖和节流实现

防抖(Debounce)的实现 防抖的核心思想是在事件被触发后,延迟执行回调函数。如果在延迟时间内再次触发事件,则重新计时。适用于输入框搜索、窗口大小调整等场景。 function debounce…

js 实现分页

js 实现分页

实现分页的基本逻辑 分页功能通常需要后端返回数据总量或总页数,前端根据当前页码和每页条数截取对应数据。以下是一个基于JavaScript的简单分页实现方案: 前端分页实现 假设已有从后端获取的完整数…

js jquery

js jquery

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够…

js类实现

js类实现

使用类实现 JavaScript 功能 在 JavaScript 中,类(Class)是一种语法糖,基于原型继承机制。通过 class 关键字可以更直观地定义对象模板。 基本类定义 class…