当前位置:首页 > JavaScript

js sort实现

2026-04-04 04:50:29JavaScript

JavaScript 中的排序实现

在 JavaScript 中,数组的排序可以通过 Array.prototype.sort() 方法实现。该方法默认将元素转换为字符串并按照 Unicode 码点顺序排序。为了更灵活地排序,可以传入自定义的比较函数。

默认排序(按 Unicode 码点)

默认情况下,sort() 方法会将数组元素转换为字符串并比较它们的 Unicode 码点顺序。例如:

const fruits = ['banana', 'apple', 'orange', 'grape'];
fruits.sort();
console.log(fruits); // ['apple', 'banana', 'grape', 'orange']

对于数字排序,默认行为可能导致不符合预期的结果:

js sort实现

const numbers = [10, 2, 5, 1];
numbers.sort();
console.log(numbers); // [1, 10, 2, 5](按字符串比较)

自定义比较函数

为了正确排序数字或其他复杂数据类型,可以传入一个比较函数。比较函数接收两个参数(通常称为 ab),并根据返回值决定排序顺序:

  • 返回负数:a 排在 b 前面。
  • 返回正数:b 排在 a 前面。
  • 返回 0:顺序不变。
数字升序排序
const numbers = [10, 2, 5, 1];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 2, 5, 10]
数字降序排序
const numbers = [10, 2, 5, 1];
numbers.sort((a, b) => b - a);
console.log(numbers); // [10, 5, 2, 1]
对象数组排序

对于对象数组,可以根据对象的某个属性排序:

js sort实现

const users = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 20 }
];

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

字符串排序(忽略大小写)

如果需要忽略大小写排序字符串,可以先将字符串转换为统一大小写:

const names = ['Alice', 'bob', 'Charlie', 'dave'];
names.sort((a, b) => a.localeCompare(b, undefined, { sensitivity: 'base' }));
console.log(names); // ['Alice', 'bob', 'Charlie', 'dave']

稳定排序

从 ES2019 开始,sort() 方法被要求是稳定的,即相同值的元素在排序后保持原始顺序。例如:

const items = [
  { name: 'Apple', category: 'fruit' },
  { name: 'Carrot', category: 'vegetable' },
  { name: 'Banana', category: 'fruit' }
];

// 按 category 排序(稳定排序)
items.sort((a, b) => a.category.localeCompare(b.category));
console.log(items);
// [
//   { name: 'Apple', category: 'fruit' },
//   { name: 'Banana', category: 'fruit' },
//   { name: 'Carrot', category: 'vegetable' }
// ]

性能注意事项

sort() 方法的时间复杂度因浏览器实现而异,但通常是 O(n log n)。对于大型数组,自定义比较函数的性能可能成为瓶颈,应尽量减少比较函数的复杂度。

通过灵活使用比较函数,可以满足大多数排序需求。

标签: jssort
分享给朋友:

相关文章

vue.js实现轮播

vue.js实现轮播

Vue.js 实现轮播功能 使用第三方库(推荐) Vue.js 生态中有许多成熟的轮播组件库,例如 vue-awesome-swiper 或 swiper,它们功能丰富且易于集成。 安装 swipe…

js实现列表

js实现列表

使用 JavaScript 实现列表 JavaScript 提供了多种方式来实现列表功能,包括数组操作、DOM 元素动态生成等。以下是几种常见的实现方法: 使用数组存储列表数据 数组是 JavaSc…

js实现目录

js实现目录

实现目录的基本思路 在JavaScript中实现目录功能通常涉及以下几个核心步骤:解析文档中的标题元素(如h1-h6),动态生成目录结构,并添加交互逻辑(如点击跳转)。以下是具体实现方法: 解析标题…

vue实现js休眠

vue实现js休眠

实现 JavaScript 休眠的方法 在 Vue 中实现 JavaScript 休眠(延迟执行)可以通过以下方式实现。由于 JavaScript 本身没有内置的 sleep 函数,通常使用 Prom…

js节流实现

js节流实现

节流的概念 节流(Throttle)是一种限制函数执行频率的技术,确保函数在一定时间间隔内只执行一次。常用于滚动事件、窗口调整等高频触发的场景。 基础实现方法 使用时间戳判断是否执行函数: fun…

js实现定位

js实现定位

使用Geolocation API获取当前位置 在JavaScript中,可以通过浏览器内置的Geolocation API获取用户的地理位置信息。该API需要用户授权才能访问位置数据。 if (n…