冒泡排序原理:比较相邻两个数的大小,如果第一个数大于第二个数,那么交换位置,从第一位数开始,对后面每一对相邻的数据进行同样的比较和交换,直到最后没有任何一位需要进行比较大小和交换;

思路演算:

arr = [2, 5, 6, 3, 1];
//两两比较大小,如果大于那么交换
//2 > 5 ? 不交换,arr = [2, 5, 6, 3, 1]
//5 > 6 ? 不交换,arr = [2, 5, 6, 3, 1]
//6 > 3 ? 交换,arr = [2, 5, 3, 6, 1]
//6 > 1 ? 交换,arr = [2, 5, 3, 1, 6]
第一轮的数据两两比较大小,交换位置就完成了,最终数组中最大的数据 6 被交换到了最后,沉入数组末尾

//2 > 5 ?  不交换,arr = [2, 5, 3, 1, 6]
//5 > 3 ? 交换,arr = [2, 3, 5, 1, 6]
//5 > 2 ? 交换,arr = [2, 3, 1, 5, 6]
第二轮的数据两两比较大小,交换位置就完成了,最终数组中第二大的数据 5 被交换到了数组后面
//2 > 3 ?  不交换,arr = [2, 3, 1, 5, 6]
//3 > 1 ? 交换,arr = [2, 1, 3, 5, 6]

第三轮的数据两两比较大小,交换位置就完成了
//2 > 1 ?  交换,arr = [1, 2, 3, 5, 6]
第四轮的数据两两比较大小,交换位置就完成了

经过四轮的数据比较,显而易见,数据已经完成了升序排列。

从上面的演算中发现规律:
  数组的长度 arr.length = 5,循环了4轮就完成了排序,
  每一轮的循环 进行了 两两比较大小,
  并且每一轮的中的 两两比较 次数都比前一次少,
  直到没有两个数据可以拿来比较为止。
 for(var i = 0; i < arr.length - 1; i++){
  //表示要进行几轮比较
}
 for(var i = 0; i < arr.length - 1; i++){
for(var j = 0; j < arr.length - 1 - i;j++){
// 每一轮的数据比较都是 从数组的 下标0 开始,
// 每一轮,两两比较的次数都比上一轮少1 次
// 当 i=0 的时候, j < 5 - 1 - 0 即 j < 4
      // 当 i=1 的时候, j < 5 - 1 - 1 即 j < 3
      // 依次类推
}
}
 for(var i = 0; i < arr.length - 1; i ++){
for(var j = 0; j < arr.length - 1 - i: j++){
       // 定义一个临时变量,用来存储较大的那个数据
var temp;
       // 比较数组中相邻的那个数,如果第一个数比第二个数大,那么
if(arr[j] > arr [j+1]){
         // 将较大的数 存放在 temp 变量中
temp = arr[j];
         // 将 较小的数据 赋值给 前一位
arr[j] = arr[j+1];
         // 将 存放了较大数据的临时变量 赋值给 后一位, 完成数据的交换位置
arr[j+1] = temp;
}
}
}

JS 冒泡排序详解的更多相关文章

  1. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

  2. Node.js npm 详解

    一.npm简介 安装npm请阅读我之前的文章Hello Node中npm安装那一部分,不过只介绍了linux平台,如果是其它平台,有前辈写了更加详细的介绍. npm的全称:Node Package M ...

  3. Vue.js项目详解

    还是以Blog项目来讲解,最近我本人利用闲暇时间,以博客作为参考学习一些新的技术并尝试之前没有尝试过的思路来玩玩. 技术看似枯燥,但是带有一个目的来学,你会发现还是蛮有趣的. 主要实践的就是前后端分离 ...

  4. JS 面向对象详解

    面向对象详解1 OO1.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  5. 开胃小菜——impress.js代码详解

    README 友情提醒,下面有大量代码,由于网页上代码显示都是同一个颜色,所以推荐大家复制到自己的代码编辑器中看. 今天闲来无事,研究了一番impress.js的源码.由于之前研究过jQuery,看i ...

  6. jquery图片切换插件jquery.cycle.js参数详解

    转自:国人的力量 blog.163.com/xz551@126/blog/static/821257972012101541835491/ 自从使用了jquery.cycle.js,我觉得再也不用自己 ...

  7. 值得收藏的js原型详解

    从虚无到Object 起初,地是空虚混沌,渊面黑暗:这时候一切还是null 神说,要有原型,于是就有了prototype 原型从凭空产生,于是需要一个指向于null的特征,人们把这种特征叫做隐式原型, ...

  8. 第三天:JS事件详解-事件流

    学习来源: F:\新建文件夹 (2)\HTML5开发\HTML5开发\04.JavaScript基础\6.JavaScript事件详解 学习内容:  1)基础概念 2)举例说明: 代码如上,如果用事件 ...

  9. 第二十二课:js事件原理以及addEvent.js的详解

    再看这篇博客之前,希望你已经对js高级程序编程一书中的事件模块进行了详读,不然我只能呵呵了. document.createEventObject,在IE下创建事件对象event. elem.fire ...

随机推荐

  1. redis命令学习(二) · THIS SPACE

    列表(Lists)操作命令 Redis列表是简单的字符串列表,按照插入顺序排序. 你可以添加一个元素导列表的头部(左边)或者尾部(右边)LPUSH命令插入一个新的元素导头部,而RPUSH插入一个新元素 ...

  2. 码海拾遗:Linux常用命令(一)

    一.Linux系统安装 系统安装可以分两类:实体机安装Linux,虚拟机(常用虚拟机软件有两种:VMware和VirtualBox)安装Linux. 安装过程网上有很多教程,这里就不赘述了. 二.常用 ...

  3. HTML 和 CSS 基础

    Contents hyper text markup language 超文本标记语言,是最基础的网页开发语言.网页文件后缀名以.html/.htm结束. 基本标签 文件标签 <!DOCTYPE ...

  4. 痞子衡嵌入式:恩智浦i.MX RT1xxx系列MCU启动那些事(11.2)- FlexSPI NOR连接方式大全(RT1060/1064(SIP))

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是恩智浦i.MX RT1060/1064(SIP)两款MCU的FlexSPI NOR启动的连接方式. 上一篇文章<FlexSPI N ...

  5. Filter过滤器Listener:监听器

    Filter过滤器 1. 概念 web中的过滤器:当访问服务器资源是,过滤器可以将请求拦截下来,完成一些特殊功能: 过滤器的作用 完成通用的操作:例如登录验证.统一编码处理.敏感字符过滤... 快速入 ...

  6. 自己动手用java写一个hashMap

    入坑java很多年了,现在总结一下自己学到的东西. 1.首先我们先来聊聊什么是HashMap? 什么是hash?hash用中文的说法就叫做“散列”,通俗的讲就是把任意长度的字符串输入,经过hash计算 ...

  7. 关于图数据库HugeGraph的百万,千万,亿量级测试

    1.Hugegraph测试硬件 1.1.本机硬件 本机测试hugeGraph版本:0.10.4 后置存储数据库:rocksdb,1TB的普通硬盘 1.2.测试服务器硬件 测试服务器hugegraph版 ...

  8. CSS中"position:relative"属性与文档流的关系

    前言 近期遇到一个问题--"position:relative"到底会不会导致元素脱离文档流?主流观点是不会,但都给不出一个有说服力的论据.最后我自己佐证了一番,总算有了个结果:& ...

  9. 学习Vue.js-Day2

    书接上文/思考反馈 react,ng,vue作用差不多,那各个都有什么特点啊,实际工作中应该用哪一个? 答:其实在实际工作中,组员会通过讨论而选择框架:这三个框架都能解放你的工作量,也适合做单页面应用 ...

  10. 前后端分离下的跨域CAS请求

    最重要的两点: ajax请求跨域的时候,默认不会携带cookie. 请求分为普通请求(HttpRequest)和Ajax请求(XMLHttpRequest) 先屡一下跨域CAS认证的流程: 前端发起a ...