javascript如何实现排序_有哪些排序算法【教程】

发布时间 - 2026-01-28 00:00:00    点击率:
Array.prototype.sort() 默认按字符串字典序排序,导致数值排序错误;需传入比较函数如(a,b)=>a-b实现数字排序;它原地修改数组,稳定性和可控性不足时需手写排序。

JavaScript 里实现排序,Array.prototype.sort() 是最常用、最直接的方式,但它的默认行为不是按数值大小排——这是绝大多数人踩坑的第一步。

为什么 sort() 默认排序结果看起来“错”了

因为 sort() 默认把元素转成字符串再比较字典序。比如 [10, 2, 33, 1] 会变成 ["10","2","33","1"],然后按首字符排序 → [1, 10, 2, 33](实际输出是 [1, 10, 2, 33])。

  • 要按数字升序:传入 (a, b) => a - b
  • 要按数字降序:传入 (a, b) => b - a
  • 对对象数组排序,比如按 age 字段: arr.sort((a, b) => a.age - b.age)
  • 注意:sort() 是原地修改,会改变原数组

哪些场景不能用 sort()?手写排序的必要性

当需要稳定排序(相同值的相对位置不变)、或明确控制比较逻辑(比如多级排序、自定义权重)、或在性能敏感场景下规避 V8 对 sort() 的内部优化不确定性时,就得自己实现。

  • Array.prototype.sort() 在 V8 中对小数组(
  • 如果排序依据是异步计算的(比如按接口返回的优先级),sort() 无法直接支持,必须先 await 拿到全部值再排
  • 需要记录每轮交换过程(教学、可视化)时,必须手写

快速写出一个可靠的插入排序(适合小数组 / 教学)

插入排序逻辑清晰、稳定、原地、适合小规模数据(≤50 项),且容易调试和改造成带日志的版本。

function insertionSort(arr) {
  const result = [...arr]; // 不污染原数组
  for (let i = 1; i < result.length; i++) {
    let j = i;
    while (j > 0 && result[j] < result[j - 1]) {
      [result[j], result[j - 1]] = [result[j - 1], result[j]];
      j--;
    }
  }
  return result;
}
  • 对比 sort():它不依赖类型转换,=== 行为完全由你控制
  • 如果要支持对象,把 result[j] 换成 compare(result[j], result[j - 1]) ,再传入自定义 compare 函数即可
  • 别在生产环境对 1000+ 元素用这个——时间复杂度 O(n²),卡顿明显

冒泡、快排、归并……真有必要手写吗

除非你在写算法题、教学材料,或者嵌入式 JS 环境(如某些 IoT 设备)连 sort() 都不支持,否则不建议在业务代码中手写这些。

  • 冒泡排序仅剩教学价值;现代 JS 引擎对 sort() 的优化远超手写
  • 快排手写易出错(边界、pivot 选择、递归爆栈),V8 的实现还做了三数取中、尾递归优化等
  • 归并排序适合稳定 + 大数据量,但需要 O(n) 额外空间;若真需要,用 arr.toSorted?.((a,b)=>a-b

    )
    (ES2025 新增,返回新数组且稳定)更省心

真正容易被忽略的是:排序前先确认数据是否已部分有序,以及是否真的需要「每次调用都重排」——很多时候缓存排序结果或用增量更新(如 splice 插入后局部调整)更高效。


# javascript  # java  # 排序算法  # 为什么  # Array  # sort  # 字符串  # 对象  # prototype  # 算法  # 递归  # 自定义  # 的是  # 这是  # 升序  # 都不  # 你在  # 就得  # 真有  # 不能用 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 专业型网站制作公司有哪些,我设计专业的,谁给推荐几个设计师兼职类的网站?  Laravel怎么导出Excel文件_Laravel Excel插件使用教程  EditPlus中的正则表达式实战(5)  东莞市网站制作公司有哪些,东莞找工作用什么网站好?  弹幕视频网站制作教程下载,弹幕视频网站是什么意思?  Laravel如何实现URL美化Slug功能_Laravel使用eloquent-sluggable生成别名【方法】  大学网站设计制作软件有哪些,如何将网站制作成自己app?  Laravel怎么连接多个数据库_Laravel多数据库连接配置  如何用西部建站助手快速创建专业网站?  如何基于云服务器快速搭建网站及云盘系统?  php静态变量怎么调试_php静态变量作用域调试技巧【解答】  使用C语言编写圣诞表白程序  实例解析Array和String方法  深圳网站制作培训,深圳哪些招聘网站比较好?  谷歌浏览器下载文件时中断怎么办 Google Chrome下载管理修复  googleplay官方入口在哪里_Google Play官方商店快速入口指南  ,怎么在广州志愿者网站注册?  Win11怎么修改DNS服务器 Win11设置DNS加速网络【指南】  Laravel怎么做缓存_Laravel Cache系统提升应用速度的策略与技巧  图册素材网站设计制作软件,图册的导出方式有几种?  Laravel如何处理文件下载请求?(Response示例)  如何为不同团队 ID 动态生成多个非值班状态按钮  Laravel怎么做数据加密_Laravel内置Crypt门面的加密与解密功能  网站制作软件有哪些,制图软件有哪些?  夸克浏览器网页跳转延迟怎么办 夸克浏览器跳转优化  韩国网站服务器搭建指南:VPS选购、域名解析与DNS配置推荐  JS中对数组元素进行增删改移的方法总结  Bootstrap整体框架之JavaScript插件架构  LinuxShell函数封装方法_脚本复用设计思路【教程】  三星、SK海力士获美批准:可向中国出口芯片制造设备  简单实现Android文件上传  Laravel如何实现密码重置功能_Laravel密码找回与重置流程  猎豹浏览器开发者工具怎么打开 猎豹浏览器F12调试工具使用【前端必备】  猪八戒网站制作视频,开发一个猪八戒网站,大约需要多少?或者自己请程序员,需要什么程序员,多少程序员能完成?  奇安信“盘古石”团队突破 iOS 26.1 提权  详解jQuery中的事件  Python文件异常处理策略_健壮性说明【指导】  宙斯浏览器视频悬浮窗怎么开启 边看视频边操作其他应用教程  英语简历制作免费网站推荐,如何将简历翻译成英文?  HTML5建模怎么导出为FBX格式_FBX格式兼容性及导出步骤【指南】  EditPlus中的正则表达式 实战(4)  网站制作壁纸教程视频,电脑壁纸网站?  Laravel如何实现多对多模型关联?(Eloquent教程)  潮流网站制作头像软件下载,适合母子的网名有哪些?  laravel怎么配置和使用PHP-FPM来优化性能_laravel PHP-FPM配置与性能优化方法  Edge浏览器如何截图和滚动截图_微软Edge网页捕获功能使用教程【技巧】  宙斯浏览器怎么屏蔽图片浏览 节省手机流量使用设置方法  Laravel如何使用Gate和Policy进行权限控制_Laravel权限判定与策略规则配置  Laravel Eloquent关联是什么_Laravel模型一对一与一对多关系精讲  Laravel如何部署到服务器_线上部署Laravel项目的完整流程与步骤