JavaScript数组排序的六种常见算法总结


Posted in Javascript onAugust 18, 2020

前言

着急用的话,选择前两个就行了,后面的看看就好。

开发中,遇到数组排序的需求很频繁,这篇文章会介绍几个常见排序思路。

一、希尔排序(性能最好)

如果要从大到小排列,则 while(arr[n] > arr[n - interval] && n > 0) 。

// 希尔排序算法
function xier(arr){
 var interval = parseInt(arr.length / 2);//分组间隔设置
 while(interval > 0){
  for(var i = 0 ; i < arr.length ; i ++){
   var n = i;
   while(arr[n] < arr[n - interval] && n > 0){
    var temp = arr[n];
    arr[n] = arr[n - interval];
    arr[n - interval] = temp;
    n = n - interval;
   }
  }
  interval = parseInt(interval / 2);
 }
 return arr;
}

// Array
var arr = [10, 20, 40, 60, 60, 0, 30]

// 打印排序后的数组
console.log(xier(arr))//[0, 10, 20, 30, 40, 60, 60]

二、sort排序(普通数组 / 数组嵌套对象)

一堆数组排序

// Array
var arr = [10, 20, 40, 60, 60, 0, 30]

// 排序方法
arr.sort(function(a,b){

 /*
 * return b-a; —> 降序排序
 * return a-b; —> 升序排列
 */
 return a-b;
})//括号里不写回调函数则默认按照字母逐位升序排列

// 打印排序后的数组
console.log(arr)//[0, 10, 20, 30, 40, 60, 60]

对象数组排序(数组套对象)

//对象数组排序
var arr = [
 {name:'syy', age:0},
 {name:'wxy', age:18},
 {name:'slj', age:8},
 {name:'wj', age:20}
];

// 排序方法
function compare(property) {//property:根据什么属性排序
 return function(a,b){
  var value1 = a[property];
  var value2 = b[property];
  /*
  * value2 - value1; ——> 降序
  * value1 - value2; ——> 升序
  */
  return value1 - value2;//升序排序
 }
}

// 打印排序后的数组
console.log(arr.sort(compare('age')))
/*
0: {name: "syy", age: 0}
1: {name: "slj", age: 8}
2: {name: "wxy", age: 18}
3: {name: "wj", age: 20}
*/

三、桶排序

特点:简单,但非常浪费内存,几乎不用。

桶中出现的数组元素都做个标记 1,然后将桶数组中有 1 标记的元素依次打印。

// Array
var arr = []

// 每个数组项做标记(1)
for(let i = 0; i < arr.length; i++) {
 let key = arr[i]
 arr[key] = 1
}

// 遍历打印出每项
for(let j in arr) {
 debugger
 console.log(j)
}

四、冒泡排序

性能:一般(需要每项进行比较)。

每一趟找出最大的值。

// Array
var arr = [10, 20, 40, 60, 60, 0, 30]

/*
* 总共比较次数为arr.length-1次
* 每次的比较次数为arr.length-1次
* 依次递减
*/
var temp;//交换变量标识

// 两层for分别表示当前项与第二项
for(let i = 0; i < arr.length - 1; i++) {
 for(let j = 0; j < arr.length - 1; j++) {

  // 如果当前项大于第二项(后一项)则交换
  if(arr[j] > arr[j+1]) {
   temp = arr[j]
   arr[j] = arr[j+1];
   arr[j+1] = temp;
  }
 }
}

// 打印排序后的数组
console.log(arr)//[0, 10, 20, 30, 40, 60, 60]

五、选择排序

性能:一般(需要每项进行比较)。

假定某个位置的值是最小值,与冒泡排序类似。

// Array
var arr = [10, 20, 40, 60, 60, 0, 30]


var temp;//交换变量标识

// 两层for分别表示当前项与第二项
for(let i = 0; i < arr.length - 1; i++) {
 for(let j = i + 1; j < arr.length; j++) {

  // 假设第二项是最小值(是则交换/否则继续比较)
  if(arr[i] > arr[j]) {
   temp = arr[i];
   arr[i] = arr[j];
   arr[j] = temp;
  }
 }
}

// 打印排序后的数组
console.log(arr)//[0, 10, 20, 30, 40, 60, 60]

六、插入排序

// Array
var arr = [10, 20, 40, 60, 60, 0, 30]

// 排序算法
for(var i = 0; i < arr.length; i++) {
 var n = i;
 while(arr[n] > arr[n+1] && n >= 0) {
 	 var temp = arr[n];
	 arr[n] = arr[n+1];
 	 arr[n+1] = temp;
	 n--;
 }
}

// 打印排序后的数组
console.log(arr)//[0, 10, 20, 30, 40, 60, 60]

总结

到此这篇关于JavaScript数组排序的六种常见算法总结的文章就介绍到这了,更多相关JavaScript数组排序常见算法内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
js模仿jquery的写法示例代码
Jun 16 Javascript
jQuery Form 页面表单提交的小例子
Nov 15 Javascript
用队列模拟jquery的动画算法实例
Jan 20 Javascript
JavaScript操作XML/HTML比较常用的对象属性集锦
Oct 30 Javascript
jQuery xml字符串的解析、读取及查找方法
Mar 01 Javascript
js日期插件dateHelp获取本月、三个月、今年的日期
Mar 07 Javascript
关于JSON.parse(),JSON.stringify(),jQuery.parseJSON()的用法
Jun 30 Javascript
js禁止Backspace键使浏览器后退的实现方法
Sep 01 Javascript
vue获取当前点击的元素并传值的实例
Mar 09 Javascript
JavaScript实现点击出现图片并统计点击次数功能示例
Jul 23 Javascript
vue2.0$nextTick监听数据渲染完成之后的回调函数方法
Sep 11 Javascript
Javascript表单序列化原理及实现代码详解
Oct 30 Javascript
js实现简单扫雷
Nov 27 #Javascript
基于JavaScript实现大文件上传后端代码实例
Aug 18 #Javascript
javascript实现扫雷简易版
Aug 18 #Javascript
详解Vue的组件中data选项为什么必须是函数
Aug 17 #Javascript
Openlayers实现扩散的动态点(水纹效果)
Aug 17 #Javascript
openLayer4实现动态改变标注图标
Aug 17 #Javascript
openlayers4实现点动态扩散
Aug 17 #Javascript
You might like
东方红 - 来复式再生机的修复
2021/03/02 无线电
PHP源码之explode使用说明
2011/08/05 PHP
如何使用Linux的Crontab定时执行PHP脚本的方法
2011/12/19 PHP
ThinkPHP的模版中调用session数据的方法
2014/07/01 PHP
跟我学Laravel之请求(Request)的生命周期
2014/10/15 PHP
关于viewport,Ext.panel和Ext.form.panel的关系
2009/05/07 Javascript
js左侧三级菜单导航实例代码
2013/09/13 Javascript
快速解决jQuery与其他库冲突的方法介绍
2014/01/02 Javascript
原生javascript实现图片弹窗交互效果
2015/01/12 Javascript
JavaScript更改字符串的大小写
2015/05/07 Javascript
JS实现字符串转日期并比较大小实例分析
2015/12/09 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
快速解决js开发下拉框中blur与click冲突
2016/10/10 Javascript
js实现返回顶部效果
2017/03/10 Javascript
在Js页面通过POST传递参数跳转到新页面详解
2017/08/25 Javascript
使用vue制作探探滑动堆叠组件的实例代码
2018/03/07 Javascript
通过一次报错详细谈谈Point事件
2018/05/17 Javascript
vue-quill-editor富文本编辑器简单使用方法
2018/09/21 Javascript
Vue唯一可以更改vuex实例中state数据状态的属性对象Mutation的讲解
2019/01/18 Javascript
微信小程序实现一张或多张图片上传(云开发)
2019/09/25 Javascript
[04:52]第二届DOTA2亚洲邀请赛主赛事第一天比赛集锦:OG娜迦海妖放大配合谜团大中3人
2017/04/02 DOTA
[01:59]翻天覆地,因你而变,7.20版本地图更新速览
2018/11/24 DOTA
python模块导入的细节详解
2018/12/10 Python
Python使用MyQR制作专属动态彩色二维码功能
2019/06/04 Python
Django 解决上传文件时,request.FILES为空的问题
2020/05/20 Python
CSS3使用多列制作瀑布流
2016/05/10 HTML / CSS
基于HTML5 Canvas的3D动态Chart图表的示例
2017/11/02 HTML / CSS
预订全球最佳旅行体验:Viator
2018/03/30 全球购物
香港莎莎官网Sasa.com:亚洲著名国际化妆品商城
2019/11/10 全球购物
企业治理工作自我评价
2013/09/26 职场文书
大学生通用个人自我评价
2014/04/27 职场文书
2014教师研修学习体会
2014/07/08 职场文书
政府四风问题整改措施
2014/10/04 职场文书
开展党的群众路线教育实践活动总结报告
2014/10/31 职场文书
如何写辞职书
2015/02/26 职场文书
Win11任务栏太宽了怎么办?一招解决Win11任务栏太宽问题
2021/11/21 数码科技