JavaScript算法学习之冒泡排序和选择排序


Posted in Javascript onNovember 02, 2019

前言

算法与数据结构构成了程序,数据结构用于实现数据的表示、存储、管理,算法通过使用数据完成一定的业务逻辑与操作,最终实现了程序的功能。因此算法在编程中的重要性是不言而喻的。很多复杂的算法都是借助最基本的算法实现的。本文主要选取经典排序算法中的冒泡排序与选择排序对JavaScript编程实现算法进行简单描述与说明。

JavaScript算法学习之冒泡排序和选择排序

程序算法

算法说明

算法(Algorithm)是解决问题的一种策略机制,算法也是有限操作指令的集合。按照算法策略输入符合要求的数据,最终获得解决问题的输出结果。冒泡算法与选择算法主要用于实现对无序的数字集合进行排序。算法描述分别如下:

1、冒泡排序算法

冒泡算法顾名思义,可以将待排序序列中的每一个元素看成一个个气泡,假设气泡的大小用元素的数值表示,这样的话最大气泡(最大的元素数字)会最先升起来,这一过程即为冒泡。冒泡算法的关键在于将未排序部分最大元素依次后移动,在序列尾端从小到大形成排序好的有序序列。冒泡排序示意如下图所示:

JavaScript算法学习之冒泡排序和选择排序

冒泡排序算法示意图

冒泡排序算法示意图如上图所示,其中每一行表示一次排序,排序目的找到最大值,从待排序序列中取出最大值,放到红色小球区域中,红色小球区域表示已完成排序的序列。通过上图我们可以看出,每趟排序冒泡出来的元素分别为(17,12,9,5,1)。最终排好的序列为(1,5,9,12,17)。

2、选择排序算法

选择排序是指从未排序的序列中找到最小的值并取出放到已经排好顺序的序列中,一直到未排序序列中的元素个数为零。即所有的元素都放到已经排好顺序的序列中。该算法的关键在于从未排序的序列中找到最轻(数值最小)元素,放到已经排序好的序列中。选择排序算法示意如下图所示:

JavaScript算法学习之冒泡排序和选择排序
选择排序示意图

选择排序示意图如上图所示,选择的关键在于找到最小的值,并将其放到已经排序好的序列中。上图中未排序(待排序)集合为黄色部分,排序好的部分为绿色背景部分,每一行为一次排序,排序目的找到最小元素。通过上图可知选择出来的最小值依次为(1,5,9,12,17)。

冒泡排序实现

JavaScript冒泡排序主要借助JavaScript array数字对象实现待排序序列的存储,通过循环语句遍历数组,从待排序序列的第一个元素开始与后面元素比较,如大于后面元素则交换,因此经过一趟遍历,最大元素将会跑到array数组的末尾。实现代码描述如下:

var arr1=[9,1,4,13,7,8,20,23,15]; 
 var wlen1=arr1.length;
 var count1=0;//记录总执行次数 
 for(var i=0;i<arr1.length-1;i++) { 
 for(var j=0;j<wlen1;j++) { 
 if(arr1[j]>arr1[j+1]) { 
 var temp; 
 temp=arr1[j]; 
 arr1[j]=arr1[j+1]; 
 arr1[j+1]=temp; 
 count1++; 
 } 
 } 
 wlen1=wlen1-1; 
 }

选择排序实现

按照算法描述选择排序需要使用两个JavaScript数组对象,一个为待排序序列存储数据,一个为排序完成数组。分别从待排序序列数组中找到最小值并取出存储到完成排序数组中。arr数组为待排序数组,res数组为排序完成数组。使用javaScript实现选择排序代码描述如下:

var arr=[9,1,4,13,7,8,20,23,15]; 
 var wlen=arr.length; 
 var count=0;//记录已完成排序元素数量 
 var res=[];//最终排序结果数组 
 var minvalue=0; //思路从未排序序列选择最小元素放到已经完成排序的数组中 
 for(var i=0;i<wlen;i++) { //找到最小元素 
 minvalue=arr[0]; 
 for(var j=0;j<arr.length;j++) { 
 if(minvalue>arr[j]) { 
 minvalue=arr[j]; 
 var temp; 
 temp=arr[0]; 
 arr[0]=arr[j]; 
 arr[j]=temp; 
 } 
 count++; 
 } 
 arr.shift(); 
 res[i]=minvalue; 
 }

JavaScript实现基本冒泡与选择排序算法描述如上所示,本例设计测试用例为(9,1,4,13,7,8,20,23,15),该待排序测试用例分别执行冒泡排序与选择排序,效果展示如下图

JavaScript算法学习之冒泡排序和选择排序

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
走出JavaScript初学困境—js初学
Dec 29 Javascript
javascript html 静态页面传参数
Apr 10 Javascript
ExtJS 2.0实用简明教程 之ExtJS版的Hello
Apr 29 Javascript
js jquery获取随机生成id的服务器控件的三种方法
Jul 11 Javascript
javascript匿名函数实例分析
Nov 18 Javascript
详解Angular.js中$http拦截器的介绍及使用
Jul 04 Javascript
如何理解Vue的.sync修饰符的使用
Aug 17 Javascript
原生JavaScript实现todolist功能
Mar 02 Javascript
微信小程序开发背景图显示功能
Aug 08 Javascript
angular1.x ui-route传参的三种写法小结
Aug 31 Javascript
详解jquery和vue对比
Apr 16 jQuery
解决VUE自定义拖拽指令时 onmouseup 与 click事件冲突问题
Jul 24 Javascript
如何正确理解vue中的key详解
Nov 02 #Javascript
Javascript 关于基本类型和引用类型的个人理解
Nov 01 #Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
Nov 01 #Javascript
vue iview的菜单组件Mune 点击不高亮的解决方案
Nov 01 #Javascript
解决vue项目刷新后,导航菜单高亮显示的位置不对问题
Nov 01 #Javascript
vue实现点击追加选中样式效果
Nov 01 #Javascript
vue 导航内容设置选中状态样式的例子
Nov 01 #Javascript
You might like
Uncaught exception com_exception with message Failed to create COM object
2012/01/11 PHP
smarty简单入门实例
2014/11/28 PHP
PHP中SERIALIZE和JSON的序列化与反序列化操作区别分析
2016/10/11 PHP
php PDO属性设置与操作方法分析
2018/12/27 PHP
js open() 与showModalDialog()方法使用介绍
2013/09/10 Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
2013/10/08 Javascript
使用AngularJS处理单选框和复选框的简单方法
2015/06/19 Javascript
js实现的简单radio背景颜色选择器代码
2015/08/18 Javascript
js为什么不能正确处理小数运算?
2015/12/29 Javascript
原生JS下拉加载插件分享
2016/12/26 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
使用VueRouter的addRoutes方法实现动态添加用户的权限路由
2019/06/03 Javascript
js实现类似iphone的网页滑屏解锁功能示例【附源码下载】
2019/06/10 Javascript
vue计算属性无法监听到数组内部变化的解决方案
2019/11/06 Javascript
精读《Vue3.0 Function API》
2020/05/20 Javascript
NodeJS模块Buffer原理及使用方法解析
2020/11/11 NodeJs
Vue 使用iframe引用html页面实现vue和html页面方法的调用操作
2020/11/16 Javascript
适用于 Vue 的播放器组件Vue-Video-Player操作
2020/11/16 Javascript
element 动态合并表格的步骤
2020/12/31 Javascript
python中的reduce内建函数使用方法指南
2014/08/31 Python
python根据出生年份简单计算生肖的方法
2015/03/27 Python
对Python3 pyc 文件的使用详解
2019/02/16 Python
pymysql模块的使用(增删改查)详解
2019/09/09 Python
基于梯度爆炸的解决方法:clip gradient
2020/02/04 Python
python实现数字炸弹游戏程序
2020/07/17 Python
scrapy实践之翻页爬取的实现
2021/01/05 Python
html+css实现自定义图片上传按钮功能
2019/09/04 HTML / CSS
总经理职责范文
2013/11/08 职场文书
汽车销售顾问求职自荐信
2014/01/01 职场文书
劳动工资科岗位职责范本
2014/03/02 职场文书
战友聚会主持词
2014/04/02 职场文书
2014年五四青年节演讲比赛方案
2014/04/22 职场文书
服务整改报告
2014/11/06 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
运动会三级跳加油稿
2015/07/21 职场文书
2019年入党思想汇报
2019/03/25 职场文书