这是今天在写vue项目时发生的一个小问题,在此记录一下,方便自己的回顾。项目是前后端分离的,前台主要使用了vue-cli3.0 + mintui,是一个移动端的web app包括了后台发布管理的一些功能,其他就先不介绍了,项目后期方便的话我会截取一些代码发布在我的github上,自己也是第一次尝试用mintui框架,当时也是感觉非常的好看,组件化开发的话也是非常方便。这次开发中主要遇到的一个问题是在一个数组排序中,发现排序后的顺序不对,排序方法是经过测试没有问题的,只是这次数据量增加了一些就发生了顺序错乱的问题,刚开始以为是数据的问题,或是其他地方影响了,因为这个排序方法原来一直是可以正常使用的,后来我检查了排序的入参数组,发现没有问题,只好在排序方法的中写几个console看一下结果,发现就是排序出了问题...

  这里先贴一下排序方法:

 // 快速排序  每次选择最左边的数作为基数
function quickSort(arr){
if (arr.length<2) { return arr; }
// 定义左指针
var left=0;
// 定义右指针
var right=arr.length-1;
//开启每一轮的排序
while(left<right){
// 寻找右边比arr[0]小的数的下标
while(arr[right]>=arr[0] && left<right){
right=right-1;
}
// 寻找左边比arr[0]大的数的下标
while(arr[left]<=arr[0] && left<right){
left++;
}
//当左边指针与右边指针相遇后,交换arr[0]与当前两个指针所在的元素
if (right==left) {
let mid=arr[right];
arr[right]=arr[0];
arr[0]=mid;
break;
}
// 当左指针小于右指针的位置,交换两个指针当前位置的元素
let tem=arr[right];
arr[right]=arr[left];
arr[left]=tem;
}
//递归实现
return quickSort(arr.slice(0,left)).concat(arr.slice(left,right+1)).concat(quickSort(arr.slice(right+1)));
}

  去浏览器的控制台测试了好几遍都没有什么问题,包括后来换了冒泡排序都是错乱的结果,这让我有点摸不着头脑,干脆去搜了一下js的数组排序,无意中搜到了sort方法。

 Js中sort()方法原理及使用

sort()  方法用于对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串UniCode码。因为排序是按照字符串UniCode码的顺序进行排序的,所以首先应该把数组元素都转化成字符串(如有必要)

,以便进行比较。

语法:arrayObject.sort(sortby);

参数sortby  可选,用来规定排序的顺序,但必须是函数。

 看到这里我突然想到会不会是因为我传入的数组也是字符串,检查了一下代码,发现确实有这种可能,因为我的数组中的元素是从其他字符串数组中循环截取的,那么数字字符串排序比较就会出现这种错乱的问题,因为比较的是Ascii码,然后我加上了parseInt,再次测试,没有问题。

总结:发生问题与bug其实很常见,只要一点点的去推导测试,最终解决问题,也能取得很大收获,这个过程是很爽的,痛并快乐着。。。

记录--js中出现的数组排序问题的更多相关文章

  1. js中对arry数组的各种操作小结

    最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊,为了在以后的工作中写出最优化的代码,我 ...

  2. js中的伪数组

    一, 伪数组 1. 具有length属性 2. 按索引方式存储数据 3. 不具有数组的方法, 比如push(),pop()等 二, 生成伪数组的方法 在js中生成伪数组的方法比较多 1. functi ...

  3. js中字符串与数组的相互转换

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  5. js课程 3-10 js中字符串函数数组函数和其它语言中对应函数的区别和联系是什么

    js课程 3-10  js中字符串函数数组函数和其它语言中对应函数的区别和联系是什么 一.总结 一句话总结:js中是对象点方法的形式,这些方法都是对象的方法,而在php.java中却不是这样. 1.j ...

  6. js中关于一个数组中最大、最小值以及它们的下标的输出的一种解决办法

    今天在学习js中的数组时,遇到的输出一个数组中最大.最小值以及它们的下表,以下是自己的解决方法! <script type="text/javascript"> var ...

  7. JS中字符串与数组的一些常用方法

    真是恨透了这些类似于substring substr slice 要么长得像,要么就功能相近的方法... 1⃣️string 1.substring(start开始位置的索引,end结束位置索引) 截 ...

  8. [undefined,1] 和 [,1]的区别在哪里--认识js中的稀疏数组

    事情是这样的 今天我想写一个能快速生成一个自然数数组的函数,就是[0,1,2,3]这样的,然后我写了下面的代码: new Array(10).map((item, index) => { ret ...

  9. js中json对象数组按对象属性排序---1

    转载:https://www.cnblogs.com/jasonwang2y60/p/6656103.html 在实际工作经常会出现这样一个问题:后台返回一个数组中有i个json数据,需要我们根据js ...

随机推荐

  1. 堡垒机直接调用RUN

    两个脚本 Run.vbe   参考https://blog.csdn.net/skypeGNU/article/details/12708221 set ws=wscript.createobject ...

  2. python安装二进制k8s高可用 版本1.13.0

    一.所有安装包.脚本.脚本说明.下载链接:https://pan.baidu.com/s/1kHaesJJuMQ5cG-O_nvljtg 提取码:kkv6 二.脚本安装说明 1.脚本说明: 本实验为三 ...

  3. 上传NUnit的单元测试结果和OpenCover的单元测试覆盖率到SonarQube服务中

    SonarQube.Scanner.MSBuild.exe begin /k:"OMDCCQuotes" /d:sonar.host.url="http://myip:9 ...

  4. 【CSS】我的颜色到底听谁的?—— css的层叠性

    我们之前学了很多个选择器,都可以帮我们定位到具体标签上,然后我们在设置样式.但这也不可避免会产生一个问题:如果多个选择器同时指向同一个标签,那么到底该听谁的??? css一定有自己的机制来处理这个问题 ...

  5. Cowpatty 破解WPA-PSK加密

    一:使用wireshark 嗅探类工具打开之前抓的cpp中包含WPA握手的cap 文件,使用语法  eapol 进行过滤,可以看到抓取的Key数据 将其另存为保存到一个目录下. 二:而后就使用Cowp ...

  6. Leetcode之动态规划(DP)专题-309. 最佳买卖股票时机含冷冻期(Best Time to Buy and Sell Stock with Cooldown)

    Leetcode之动态规划(DP)专题-309. 最佳买卖股票时机含冷冻期(Best Time to Buy and Sell Stock with Cooldown) 股票问题: 121. 买卖股票 ...

  7. NDK学习笔记-JNI开发流程

    JNI(Java Native Interface)Java本地化接口,Java调用C/C++,C/C++调用Java的一套API接口 实现步骤 在Java源文件中编写native方法 public ...

  8. RDP爆破方式攻击防控思路梳理

  9. Linux 下使用 rar 进行压缩和解压缩

    1. 下载安装文件 https://www.rarlab.com/download.htm 注意下载  64位的 2. 2019.8 时的下载命令为: wget https://www.rarlab. ...

  10. 【Python】【demo实验21】【练习实例】【求球反弹高度】

    原题: 一球从100米高度自由落下,每次落地后反跳回原高度的一半:再落下,求它在第10次落地时,共经过多少米?第10次反弹多高? 我的源码: #!/usr/bin/python # encoding= ...