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加载的是外部资源,则需要等待下载完后才能执行. 所以,在这里,我们可以对其进行很多优化工作. ...

随机推荐

【算法系列学习】Dijkstra求最短路 [kuangbin带你飞]专题四最短路练习 D - Silver Cow Party
https://vjudge.net/contest/66569#problem/D trick:1~N各点到X可以通过转置变为X到1~N各点 #include<iostream> #in ...
Linux下安装Oracle的两种方式------有图形界面安装和静默安装
本文参考文章 http://blog.csdn.net/zonej/article/details/50680857 http://blog.csdn.net/tongzidane/article/d ...
Win10或Win8下ObjectARX2015 Wizard向导创建项目失败解决方法
[原创]objectARX 2015 Wizard安装向导在Win8/win10下无法创建项目的解决方法总结by edata @2017-5-1objectARX 2015 Wizard安装向导在Wi ...
java泛型探索——介绍篇
1. 泛型出现前后代码对比先来看看泛型出现前,代码是这么写的: List words = new ArrayList(); words.add("Hello "); words. ...
Win10更新补丁失败后出现无法更新正在撤销解决办法
系统更新失败,反复重启还是不行,那是不是下载下来的补丁没用了呢??所以我们先要删除Windows更新的缓存文件!在做以下操作之前,首先我们要确认系统内的windows update & BIT ...
如何使用Handler
什么是Handler? Handler可以发送和处理消息对象或Runnable对象,这些消息对象和Runnable对象与一个线程相关联.每个Handler的实例都关联了一个线程和线程的消息队列.当创建 ...
Java Class Loader
Reference: [1] http://www.cnblogs.com/kevin2chen/p/6714214.html 当调用 java命令运行一个java程序时,会启动一个java虚拟机进程 ...
xcode实用快捷键
command + R 快速编译并运行项目 command + . 停止正在运行的项目 command + shift + O 快速打开xcode文件搜索功能 command + 0 关闭左边的侧边栏 ...
javaWeb学习总结（1）- Tomcat服务器学习和使用(2)
一.Tomcat服务器端口的配置 Tomcat的所有配置都放在conf文件夹之中,里面的server.xml文件是配置的核心文件. 如果想修改Tomcat服务器的启动端口,则可以在server.xml ...
centos7搭建SVN+Apache+IF.svnadmin实现web管理SVN
阅读目录 1. 介绍 2. 软件准备 3. 建立SVN Server仓库 4. 配置安装PHP&IF.SVNadmin 5. 启动服务 1.介绍公司最近想把Windows server平台的 ...

JS 冒泡排序从学到优化

JS 冒泡排序从学到优化的更多相关文章

随机推荐

热门专题