当前位置:首页 > 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]);
}

按多条件排序

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

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实现列表排序

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

相关文章

js实现轮播图

js实现轮播图

轮播图实现方法 基础HTML结构 <div class="slider"> <div class="slides"> <img src="image1.jpg…

vue实现列表权限

vue实现列表权限

实现列表权限的基本思路 在Vue中实现列表权限通常涉及根据用户角色或权限动态渲染列表内容。核心逻辑是通过权限判断控制列表项的显示、隐藏或操作权限。 权限数据管理 使用Vuex或Pinia存储全局权限…

js实现文件下载

js实现文件下载

使用 a 标签下载文件 通过动态创建 a 标签并设置 download 属性实现文件下载。适用于已知文件 URL 或 Blob 数据的情况。 function downloadFile(url, f…

js实现全选

js实现全选

实现全选功能的方法 在JavaScript中实现全选功能通常涉及监听全选复选框的点击事件,并根据其状态控制其他复选框的选中状态。以下是几种常见的实现方式: 基础DOM操作实现 通过获取所有目标复选框…

js如何实现继承

js如何实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例能够访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Paren…

js实现图片放大缩小

js实现图片放大缩小

实现图片放大缩小的基础方法 使用CSS的transform: scale()属性可以快速实现图片的放大缩小效果。通过JavaScript动态修改该属性值: const img = document…