iis服务器助手广告广告
返回顶部
首页 > 资讯 > 精选 >好程序员web前端培训分享JavaScript学习笔数组的排序
  • 679
分享到

好程序员web前端培训分享JavaScript学习笔数组的排序

2023-06-03 11:06:25 679人浏览 泡泡鱼
摘要

  好程序员web前端培训分享javascript学习笔数组的排序,排序,就是把一个乱序的数组,通过我们的处理,让他变成一个有序的数组,今天我们讲解两种方式来排序一个数组 冒泡排序 和 选择排序冒泡排序·&nb

  好程序员web前端培训分享javascript学习数组排序,排序,就是把一个乱序的数组,通过我们的处理,让他变成一个有序的数组,今天我们讲解两种方式来排序一个数组 冒泡排序 和 选择排序

冒泡排序

· 先遍历数组,让挨着的两个进行比较,如果前一个比后一个大,那么就把两个换个位置

· 数组遍历一遍以后,那么最后一个数字就是最大的那个了

· 然后进行第二遍的遍历,还是按照之前的规则,第二大的数字就会跑到倒数第二的位置

· 以此类推,最后就会按照顺序把数组排好了

我们先来准备一个乱序的数组

var arr = [3, 1, 5, 6, 4, 9, 7, 2, 8]

· 接下来我们就会用代码让数组排序

先不着急循环,先来看数组里面内容换个位置

// 假定我现在要让数组中的第 0 项和第 1 项换个位置// 需要借助第三个变量var tmp = arr[0]arr[0] = arr[1]arr[1] = tmp

第一次遍历数组,把最大的放到最后面去

for (var i = 0; i < arr.length; i++) {

  // 判断,如果数组中的当前一个比后一个大,那么两个交换一下位置  if (arr[i] > arr[i + 1]) {

    var tmp = arr[i]

    arr[i] = arr[i + 1]

    arr[i + 1] = tmp

  }}

// 遍历完毕以后,数组就会变成 [3, 1, 5, 6, 4, 7, 2, 8, 9]

· 第一次结束以后,数组中的最后一个,就会是最大的那个数字

· 然后我们把上面的这段代码执行多次。数组有多少项就执行多少次

按照数组的长度来遍历多少次

for (var j = 0; j < arr.length; j++) {

  for (var i = 0; i < arr.length; i++) {

    // 判断,如果数组中的当前一个比后一个大,那么两个交换一下位置    if (arr[i] > arr[i + 1]) {

      var tmp = arr[i]

      arr[i] = arr[i + 1]

      arr[i + 1] = tmp

    }

  }}

// 结束以后,数组就排序好了

给一些优化

· 想象一个问题,假设数组长度是 9,第八次排完以后

· 后面八个数字已经按照顺序排列好了,剩下的那个最小的一定是在最前面

· 那么第九次就已经没有意义了,因为最小的已经在最前面了,不会再有任何换位置出现了

· 那么我们第九次遍历就不需要了,所以我们可以减少一次

for (var j = 0; j < arr.length - 1; j++) {

  for (var i = 0; i < arr.length; i++) {

    // 判断,如果数组中的当前一个比后一个大,那么两个交换一下位置    if (arr[i] > arr[i + 1]) {

      var tmp = arr[i]

      arr[i] = arr[i + 1]

      arr[i + 1] = tmp

    }

  }}

· 第二个问题,第一次的时候,已经把最大的数字放在最后面了

· 那么第二次的时候,其实倒数第二个和最后一个就不用比了

· 因为我们就是要把倒数第二大的放在倒数第二的位置,即使比较了,也不会换位置

· 第三次就要倒数第三个数字就不用再和后两个比较了

· 以此类推,那么其实每次遍历的时候,就遍历当前次数 - 1 次

for (var j = 0; j < arr.length - 1; j++) {

  for (var i = 0; i < arr.length - 1 - j; i++) {

    // 判断,如果数组中的当前一个比后一个大,那么两个交换一下位置    if (arr[i] > arr[i + 1]) {

      var tmp = arr[i]

      arr[i] = arr[i + 1]

      arr[i + 1] = tmp

    }

  }}

至此,一个冒泡排序就完成了

选择排序

· 先假定数组中的第 0 个就是最小的数字的索引

· 然后遍历数组,只要有一个数字比我小,那么就替换之前记录的索引

· 知道数组遍历结束后,就能找到最小的那个索引,然后让最小的索引换到第 0 个的位置

· 再来第二趟遍历,假定第 1 个是最小的数字的索引

· 在遍历一次数组,找到比我小的那个数字的索引

· 遍历结束后换个位置

· 依次类推,也可以把数组排序好

准备一个数组 var arr = [3, 1, 5, 6, 4, 9, 7, 2, 8]

假定数组中的第 0 个是最小数字的索引 var minIndex = 0

遍历数组,判断,只要数字比我小,那么就替换掉原先记录的索引

var minIndex = 0for (var i = 0; i < arr.length; i++) {

  if (arr[i] < arr[minIndex]) {

    minIndex = i

  }}

// 遍历结束后找到最小的索引// 让第 minIndex 个和第 0 个交换var tmp = arr[minIndex]arr[minIndex] = arr[0]arr[0] = tmp

按照数组的长度重复执行上面的代码

for (var j = 0; j < arr.length; j++) {

  // 因为第一遍的时候假定第 0 个,第二遍的时候假定第 1 个  // 所以我们要假定第 j 个就行  var minIndex = j

  

  // 因为之前已经把最小的放在最前面了,后面的循环就不需要判断前面的了  // 直接从 j + 1 开始  for (var i = j + 1; i < arr.length; i++) {

    if (arr[i] < arr[minIndex]) {

      minIndex = i

    }

  }

  // 遍历结束后找到最小的索引  // 第一堂的时候是和第 0 个交换,第二趟的时候是和第 1 个交换  // 我们直接和第 j 个交换就行  var tmp = arr[minIndex]

  arr[minIndex] = arr[j]

  arr[j] = tmp}

一些优化

· 和之前一样,倒数第二次排序完毕以后,就已经排好了,最后一次没有必要了

for (var j = 0; j < arr.length - 1; j++) {

  var minIndex = j

  

  for (var i = j + 1; i < arr.length; i++) {

    if (arr[i] < arr[minIndex]) {

      minIndex = i

    }

  }

  var tmp = arr[minIndex]

  arr[minIndex] = arr[j]

  arr[j] = tmp}

· 在交换变量之前,可以判断一下,如果我们遍历后得到的索引和当前的索引一直

· 那么就证明当前这个就是目前最小的,那么就没有必要交换

· 做一我们要判断,最小作引和当前作引不一样的时候,才交换

for (var j = 0; j < arr.length - 1; j++) {

  var minIndex = j

  

  for (var i = j + 1; i < arr.length; i++) {

    if (arr[i] < arr[minIndex]) {

      minIndex = i

    }

  }

  if (minIndex !== j) {

    var tmp = arr[minIndex]

    arr[minIndex] = arr[j]

    arr[j] = tmp   

  }}

至此,选择排序完成

--结束END--

本文标题: 好程序员web前端培训分享JavaScript学习笔数组的排序

本文链接: https://www.lsjlt.com/news/234222.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 好程序员web前端培训分享JavaScript学习笔数组的排序
      好程序员web前端培训分享JavaScript学习笔数组的排序,排序,就是把一个乱序的数组,通过我们的处理,让他变成一个有序的数组,今天我们讲解两种方式来排序一个数组 冒泡排序 和 选择排序冒泡排序·&nb...
    99+
    2023-06-03
  • 好程序员web前端培训分享学习JavaScript
    好程序员web前端教程分享学习JavaScript,我试着总结自己学习JavaScript的方法 JavaScript给人那种感觉的原因多半是因为它如下的特点: 本身知识很抽象、晦涩难懂,如:闭包、内置对象、DOM。本身...
    99+
    2023-06-03
  • 好程序员web前端培训分享JavaScript学习笔记SASS
      好程序员web前端培训分享JavaScript学习笔记SASS,世界上最成熟、最稳定、最强大的专业级CSS扩展语言!· sass 是一个 css 的预编译工具· 也就是能够 更优雅 的书...
    99+
    2023-06-03
  • 好程序员web前端培训分享JavaScript学习笔记之ES5
      好程序员web前端培训分享JavaScript学习笔记之ES5,我们所说的 ES5 和 ES6 其实就是在 js 语法的发展过程中的一个版本而已  比如我们使用的微信  最早的版本是没有支付功能的  随着时间的流逝,后来出现了一个版本,...
    99+
    2023-06-03
  • 好程序员web前端培训分享JavaScript学习笔记ajax及ajax封装
      好程序员web前端培训分享JavaScript学习笔记ajax及ajax封装,ajax 全名 async javascript and XML  是前后台交互的能力  也就是我们客户端给服务端发送消息的工具,以及接受...
    99+
    2023-06-03
  • 好程序员web前端培训分享JavaScript学习笔记闭包与继承
      好程序员web前端培训分享JavaScript学习笔记闭包与继承,闭包:闭包是我们函数的一种高级使用方式,在聊闭包之前我们要先回顾一下 函数函数的两个阶段我们一直说函数有两个阶段定义阶段调用阶段开辟一个 存储空间把函...
    99+
    2023-06-03
  • 好程序员web前端培训分享怎样学好css?
      好程序员web前端培训分享怎样学好css?我推荐题主的学习方法就是:善用调试工具。  使用谷歌浏览器进行调试,在属性不理解时可以直接在浏览器里进行数值调节  css在书写时由于选择器权重问题经常出现样式覆盖的问题  如果你的选择器书写正...
    99+
    2023-06-03
  • 好程序员web前端培训分享HTMLCSS学习之CSS基础
      好程序员web前端培训分享HTMLCSS学习之CSS基础,CSS(cascading style sheet) 汉译为层叠样式表,是用于控制网页样式WEB标准中的表现标准语言,在网页中主要对网页信息的显示进行控制。目前推荐遵循的是W3C...
    99+
    2023-06-03
  • ​好程序员web前端培训分享node学习笔记系列之四十一
    好程序员web前端培训分享node学习笔记系列之四十一一、手动封装body-parser中间件 cookie-parser中间件1、封装axios请求方式body-parserconst qs = requir...
    99+
    2023-06-03
  • 好程序员web前端培训之JavaScript数组去重方法
      好程序员web前端之JavaScript数组去重方法,一周学习结束,老师布置我们要写一篇技术文章,脑袋里面的第一个想法就是数组去重,在网上也百度了一下,很多公司面试的时候有很大的几率会问数组去重的问题。所以今天我就给大家分享我所用过的四...
    99+
    2023-06-03
  • 好程序员web前端培训分享关于parseInt函数的一切
      好程序员web前端培训分享关于parseInt函数的一切,关于JS的手动类型转换,parseInt是我们最早接触的函数之一。  接下来我们详细的总结一下它的用法,你可以点击收藏,以备不时之需。parseInt()作用是将参数(通常为字符...
    99+
    2023-06-03
  • 好程序员web前端培训分享做H5页面需要学什么
      好程序员web前端培训分享做H5页面需要学什么,很多人问过我这个问题,而问这个问题的人基本上都是刚听说过h6,处在懵懂的阶段,他们往往会被一些网上炫酷页面所吸引,开始的目的也很简单,能通过自己的努力做出这些页面,而这些页面效果一般只要通...
    99+
    2023-06-03
  • 好程序员web前端培训分享kbone高级-事件系统
      好程序员web前端培训分享kbone高级-事件系统:1、用法,对于多页面的应用,在 Web 端可以直接通过 a 标签或者 location 对象进行跳转,但是在小程序中则行不通...
    99+
    2023-06-03
  • 好程序员web前端教程分享JavaScript学习笔记之Event事件二
      好程序员web前端教程分享JavaScript学习笔记之Event事件二,今天来聊一聊事件的执行机制。  什么是事件的执行机制呢?  思考一个问题?  当一个大盒子嵌套一个小盒子的时候,并且两个盒子都有点击事件你点击里面的小盒子,外面的...
    99+
    2023-06-03
  • 好程序员web前端分享CSS学习:HSLA颜色模式
    好程序员web前端分享CSS学习:HSLA颜色模式一、理论:1.HSLA颜色模式a.HSLA在HSL基础上增加了不透明度,值越大透明度越低b.HSLA颜色模式的浏览器兼容性和HSL一样,只有较新版本的主流浏览器才支持2.RGBA和HSLA颜...
    99+
    2023-06-03
  • 好程序员大数据培训分享大数据还学吗?
      好程序员大数据培训分享大数据还学吗?大数据现在很火,不仅有国家政策支持,还有企业的高薪诱惑,不少同学都有意向转行到大数据的想法。  但是,大数据好学吗?该不该转行大数据?这是很多同学心中的疑惑,就来给大家解答一下这些问题。  第一个问题...
    99+
    2023-06-01
  • 好程序员Java培训分享Java常见排序算法之插入排序
    好程序员Java培训分享Java常见排序算法之插入排序,之前我们说过排序是算法中的一部分。所以我们学习排序也是算法的入门,为了能让大家感受到排序是算法的一部分,我举个例子证明一下:比如麻 将游戏,发完牌之后需要对手上的牌进行排序,大家想想,...
    99+
    2023-06-02
  • 好程序员Java培训分享Java初学者必读
      好程序员Java培训分享Java初学者必读,近年来各种各样的编程语言不断崛起,但唯有Java是牢牢占据着老大的位置,目前几乎90%以上的大中型互联网应用系统在服务器端开发首选Java。因此,也是吸引了不少年轻人投入到Java的学习之中。...
    99+
    2023-06-02
  • 好程序员分享JavaScript学习笔记ES5中常见的数组方法
      好程序员分享JavaScript学习笔记ES5中常见的数组方法,ES5中常见的数组常用方法之前我们讲过的数组常用方法都是ES3的方法,今天来说一些ES5中的方法。indexOf· indexOf 用来找到数组中某一项的索引·&...
    99+
    2023-06-03
  • 好程序员web前端分享WebSocket协议
         好程序员web前端分享WebSocket协议,WebSocket协议简介WebSocket协议简介WebSocket是html5规范新引入的功能,用于解决浏览器与后台服务器双向通讯的问题,使用WebS...
    99+
    2023-06-03
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作