JS 冒泡排序从学到优化
目的:理解算法 深化算法
冒泡排序:
直接上动图好于文字

一个冒泡实例
45,67,23,88,21,6,99
// 第一轮 6次
// 45 67 23 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 21 88 6 99
// 45 23 67 21 6 88 99
// 45 23 67 21 6 88 99
// 第二轮 6次
// 23 45 67 21 6 88 99
// 23 45 67 21 6 88 99
// 23 45 21 67 6 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99
// 第三轮 6次
// 23 45 21 6 67 88 99
// 23 21 45 6 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 第四轮 6次
// 21 23 6 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 第五轮 6次
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 第六轮 6次(这个第6轮即使后面已经成型了 它还是按照程序走一遍)
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
上代码(基础型)
冒泡排序:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
//(双重for循环 第一个for控制轮数 第二个for控制次数 比较的轮数为数据个数-1 一轮比较的次数为数据个数-1 总个数为比较轮数*1轮比较次数)
var a=[45,67,23,88,21,6,99];
var temp=[];
var m=0;//轮数
var n=0;//一共次数
for(var i=0;i<a.length-1;i++){//这里不减1 后面轮数就+1 这是不对的 因为数组下标0开始
for(var j=0;j<a.length-1;j++){
if(a[j]>a[j+1]){//后面的大于前面的 后面再前 前面在后 从小到大
temp=a[j];//a[j]=temp;
a[j]=a[j+1];//a[j+1]=a[j];
a[j+1]=temp;//a[j+1]=temp
//顺序不能调换 因为a[]里面有个下标是一定从小到大的
}
n++
}
m++;
}
//document.write(a.length);
document.write(a+"<br>");
document.write("轮数"+m+"<br>");
document.write("总次数"+n+"<br>");
// a1 a2
// 3 2
// temp // 2 3
// temp // 2 3
// temp // 第一轮 6次
// 45 67 23 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 21 88 6 99
// 45 23 67 21 6 88 99
// 45 23 67 21 6 88 99 // 第二轮 6次
// 23 45 67 21 6 88 99
// 23 45 67 21 6 88 99
// 23 45 21 67 6 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99 // 第三轮 6次
// 23 45 21 6 67 88 99
// 23 21 45 6 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99 // 第四轮 6次
// 21 23 6 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99 // 第五轮 6次
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 第六轮 6次(这个第6轮即使后面已经成型了 它还是按照程序走一遍)
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99 </script>
</head>
<body> </body>
</html>
上代码(优化1):
冒泡排序优化://每轮比较少比较一次。(每一轮都会比较出一个最大值,然后后一轮没有必要再比较了,所以没比较一轮,就少比较一次。。。) j<a.length-1-i
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var a=[45,67,23,88,21,6,99];
var temp=[];
var m=0;//轮数
var n=0;//一共次数
for(var i=0;i<a.length-1;i++){//这里不减1 后面轮数就+1 这是不对的 因为数组下标0开始
for(var j=0;j<a.length-1-i;j++){ //每轮比较少比较一次。(每一轮都会比较出一个最大值,然后后一轮没有必要再比较了,所以没比较一轮,就少比较一次。。。)
if(a[j]>a[j+1]){//后面的大于前面的 后面再前 前面在后 从小到大
temp=a[j];//a[j]=temp;
a[j]=a[j+1];//a[j+1]=a[j];
a[j+1]=temp;//a[j+1]=temp
//顺序不能调换 因为a[]里面有个下标是一定从小到大的
}
n++
}
m++;
}
//document.write(a.length);
document.write(a+"<br>");
document.write("轮数"+m+"<br>");
document.write("总次数"+n+"<br>");
// a1 a2
// 3 2
// temp // 2 3
// temp // 2 3
// temp // 第一轮 6次
// 45 67 23 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 21 88 6 99
// 45 23 67 21 6 88 99
// 45 23 67 21 6 88 99 // 第二轮 6次
// 23 45 67 21 6 88 99
// 23 45 67 21 6 88 99
// 23 45 21 67 6 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 // 第三轮 6次
// 23 45 21 6 67 88 99
// 23 21 45 6 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88
// 23 21 6 45 67 88 99 // 第四轮 6次
// 21 23 6 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99 // 第五轮 6次
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 第六轮 6次(这个第6轮即使后面已经成型了 它还是按照程序走一遍)
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99 // 第一轮 6次
// 45 67 23 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 21 88 6 99
// 45 23 67 21 6 88 99
// 45 23 67 21 6 88 99 // 第二轮 5次
// 23 45 67 21 6 88 99
// 23 45 67 21 6 88 99
// 23 45 21 67 6 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99 // 第三轮 4次
// 23 45 21 6 67 88 99
// 23 21 45 6 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99 // 第四轮 3次
// 21 23 6 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99 // 第五轮 2次
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99 // 第六轮 1次
// 6 21 23 45 67 88 99 </script>
</head>
<body> </body>
</html>
这里的i就是为了减少比较次数的,通过红色数字可以看出,每一轮下来,其实红色部分是不会再进行比较的,因为他已经从大到小排了,如果是基础版,必须得走,优化后,红色的那部分无需再进行比较.
次数=n(n-1)/2
上代码(优化2):
冒泡排序优化2
做一个判断
如果在比较的时候 两两不发生比较了 就退出循环
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var a=[45,67,23,88,21,6,99];
//var a=[3,2,1,0,6];
//var a=[1,2,4,3,5,6,7,8,9];
var temp=[];
var m=0;//轮数
var n=0;//一共次数
//如果比较完备提前结束比较。(判断,如果本次比较没有移动任何元素,那么说明已经比较完成)
for(var i=0;i<a.length-1;i++){//这里不减1 后面轮数就+1 这是不对的 因为数组下标0开始
//开闭原则。(写在第一个for循环里,是为了,每轮比较初始化bool变量变为true。)
var bool=true;
for(var j=0;j<a.length-1-i;j++){ //每轮比较少比较一次。(每一轮都会比较出一个最大值,然后后一轮没有必要再比较了,所以没比较一轮,就少比较一次。。。)
if(a[j]>a[j+1]){//后面的大于前面的 后面再前 前面在后 从小到大
temp=a[j];//a[j]=temp;
a[j]=a[j+1];//a[j+1]=a[j];
a[j+1]=temp;//a[j+1]=temp
//顺序不能调换 因为a[]里面有个下标是一定从小到大的
bool=false; }
n++;
} //bool这个变量默认值为true;如果本轮比较有一对元素相互交换位置,那么也不能跳出循环。
//但是,如果本轮比较没有任何元素相互交换位置,那么说明已经比较完成,可以跳出循环。
m++;
if(bool){
break;
} }
//document.write(a.length);
document.write(a+"<br>"); document.write("总次数"+n+"<br>");
document.write("轮数"+m+"<br>");
// a1 a2
// 3 2
// temp // 2 3
// temp // 2 3
// temp // 第一轮 6次
// 45 67 23 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 21 88 6 99
// 45 23 67 21 6 88 99
// 45 23 67 21 6 88 99 // 第二轮 6次
// 23 45 67 21 6 88 99
// 23 45 67 21 6 88 99
// 23 45 21 67 6 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99 // 第三轮 6次
// 23 45 21 6 67 88 99
// 23 21 45 6 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99 // 第四轮 6次
// 21 23 6 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99 // 第五轮 6次
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 第六轮 6次(这个第6轮即使后面已经成型了 它还是按照程序走一遍)
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99 // 第一轮 6次
// 45 67 23 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 88 21 6 99
// 45 23 67 21 88 6 99
// 45 23 67 21 6 88 99
// 45 23 67 21 6 88 99 // 第二轮 5次
// 23 45 67 21 6 88 99
// 23 45 67 21 6 88 99
// 23 45 21 67 6 88 99
// 23 45 21 6 67 88 99
// 23 45 21 6 67 88 99 // 第三轮 4次
// 23 45 21 6 67 88 99
// 23 21 45 6 67 88 99
// 23 21 6 45 67 88 99
// 23 21 6 45 67 88 99 // 第四轮 3次
// 21 23 6 45 67 88 99
// 21 6 23 45 67 88 99
// 21 6 23 45 67 88 99 // 第五轮 2次
// 6 21 23 45 67 88 99
// 6 21 23 45 67 88 99 // 第六轮 1次
// 6 21 23 45 67 88 99 </script>
</head>
<body> </body>
</html>
这里加了判断后可以减少外层循环
比如 排序123
基础排序为2轮4次
-i排序为2轮3次(它只舍去了第二轮循环的第二次比较)
bool判断的话为:1轮2次 因为它进行一轮2次比较后发现下一轮没有可比较的了 直接退出循环 输出排序

JS 冒泡排序从学到优化的更多相关文章
- 客户端JS性能的一些优化的小技巧
下面是一些关于客户端JS性能的一些优化的小技巧:1.[顶]关于JS的循环,循环是一种常用的流程控制.JS提供了三种循环:for(;;). while().for(in).在这三种循环中 for(in) ...
- js资源加载优化
互联网应用或者访问量大的应用,对js的加载优化是不可少的.下面记录几种优化方法 CDN + 浏览器缓存 CDN(content delivery network)内容分发网络, 最传统的优化方式.其 ...
- JS日历控件优化(增加时分秒)
JS日历控件优化 在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时只支持 年月日 的日历控件,现在优化如下: 1. 在原基础上 支持 yyyy ...
- Vue.Js的用户体验优化
一次基于Vue.Js的用户体验优化 一.写在前面 半年以前,第一次在项目上实践VueJs,由于在那之前,没有Angular,avalon等框架的实践经验,所以在Vue的使用上,没有给自己总结出更多 ...
- C#冒泡排序法及优化
冒泡排序法及优化: static void Main(string[] args) { , , , , , }; ; //冒泡排序法 ; i < sums.Length - ; i++) //总 ...
- vue.js的app.js太大怎么优化?
vue.js的app.js太大怎么优化? # http://nginx.org/en/docs/http/ngx_http_gzip_module.htmlgzip on;gzip_min_lengt ...
- JS学习笔记12_优化
一.可维护性优化 1.添加注释 注释能够增强代码的可读性以及可维护性,当然,理想情况是满满的注释,但这不太现实.所以我们只需要在一些关键的地方添上注释: 函数和方法:尤其是返回值,因为直接看不出来 大 ...
- 一次基于Vue.Js用户体验的优化
.mytitle { background: #2B6695; color: white; font-family: "微软雅黑", "宋体", "黑 ...
- js文件加载优化
在js引擎部分,我们可以了解到,当渲染引擎解析到script标签时,会将控制权给JS引擎,如果script加载的是外部资源,则需要等待下载完后才能执行. 所以,在这里,我们可以对其进行很多优化工作. ...
随机推荐
- 玩玩kafka1 单机安装
今天主要来一遍kafka单机版的安装,比较简单易上手,关于kafka的介绍我就不贴了,大家可以自行搜索 1.首先将tgz包传到centos目录下(这里使用xftp工具) ok后查看一下tgz包是否已经 ...
- IOS(二)基本控件UIButton、简易动画、transform属性、UIImageView
UIButton //1.设置UIButton 的左右移动 .center属性 获得 CGPoint 来修改x y //1.设置UIButton 的放大缩小 bounds属性 获得CGRect 然后通 ...
- IOS打包相关问题
使用了AFNetworking框架,模拟器和真机运行都不报错,但是提交商店报错Unsupported Architecture. Your executable contains unsupporte ...
- 关于使用命令添加jar进自己的pom文件中-maven项目添加jar包
现在几乎开发项目都是使用的maven项目,但是有的时候可以使用比较偏门或者新的jar可能在网上搜不到在pom文件里的配置应该如何写,因此写下这篇博客. 比如我现在想加入的AAA.jar这个包 打开cm ...
- OC—可变数组NSMutableArray
- synchronized 修饰在 static方法和非static方法的区别
Java中synchronized用在静态方法和非静态方法上面的区别 在Java中,synchronized是用来表示同步的,我们可以synchronized来修饰一个方法.也可以synchroniz ...
- 用JS添加和删除class类名
下面介绍一下如何给一个节点添加和删除class名 添加:节点.classList.add("类名"): 删除:节点.classList.remove("类名") ...
- 第三章(附)mysql表类型MyISAM和InnoDB区别(决定了是否支持事务)
mysql表类型MyISAM和InnoDB区别 MyISAM:这个是默认类型,它是基于传统的ISAM类型,ISAM是Indexed Sequential Access Method (有索引的顺序访问 ...
- Java学习笔记——MySQL开放3306接口与设置用户权限
系统Ubuntu16.04 LTS 1.开放3306端口查看端口状态:netstat -an|grep 3306tcp 0 0 127.0.0.1:3306 ...
- Flume简介及安装
Hadoop业务的大致开发流程以及Flume在业务中的地位: 从Hadoop的业务开发流程图中可以看出,在大数据的业务处理过程中,对于数据的采集是十分重要的一步,也是不可避免的一步,从而引出我们本文的 ...