Array.sort()方法将数组中的元素进行排序,返回排序后的数组,默认是按照升序排序的。sort方法会调用数组中每一项的toString()方法,然后按照ascii编码进行排序,如果数组含有undefined元素,它们将会被排到尾部。

demo1:

var arr=[3,4,6,8,7];
arr.sort();
console.log(arr); //=>[3, 4, 6, 7, 8]

以上是一个很简单的数字排序例子没有什么问题,再看看下面的例子:

1.数字的排序

demo2:

var arr=[3,24,6,18,7,21];
arr.sort();
console.log(arr); //=>[18,21,24,3,6,7]

 

看到以上的排序结果有些人就有些懵了,数组元素超过2位数排序就出了问题,上面已经说过了sort排序是按照元素的unicode码来进行排序了,先对每一项的第一位按照ascii从小到大进行排序,如果第一位相同再将第二位按照unicode从小到大进行排序。因为

1、2、3、6、7的unicode码分别是:31、32、33、36、37,所以顺序首先是:[18,14,3,6,7,21]的第一位ascii码相同,所以再比较第二位,4的ascii码是34,所以21在24的前面,最终的排序结果是:[18,21,24,3,6,7]。虽然原因找到了,但是不是我们想要

的排序结果,Array.sort()方法允许我们传入一个比较函数进去。如果第一个参数大于第二个参数返回1,如果第一个参数小于第二个参数就返回-1,否则返回0.

var arr=[3,24,6,18,7,21];
function compare(a,b){
if(a>b){
return 1;
}else if(a<b){
return -1;
}else{
return 0;
}
}
arr.sort(compare);
console.log(arr); //=>[3,6,7,18,21,24]

以上代码中通过定义一个 compare方法实现了数字的正序排序,如果要降序再使用Array.reverse(),或者使用以下方法:

    // 升序
function ascCompare(a,b){
return a-b;
}
//降序
function desCompare(a,b){
return b-a;
}
console.log(arr.sort(ascCompare)); //=>[3,6,7,18,21,24]
console.log(arr.sort(desCompare)); //=>[24,21,18,7,6,3]

2.字母的排序:排序规则和数字的排序规则一致。

//全部为字母
var arr=['abc','bcb','bcd','bca'];
console.log(arr.sort());//=>[abc,bca,bcb,bcd] //字母和数字
var arr=[3,24,6,18,7,'abc',12,'acb','cab','53'];
arr.sort();
console.log(arr); //=>[12,18,24,3,53,6,7,abc,acb,cab]

2.对象的排序

 var obj=[{name:'huawei',value:3300},{name:'apple',value:6600},{name:'honor',value:2000},{name:'mi',value:1999}];

    function ascCompare(a,b){
return a.value-b.value;
}
//降序
function desCompare(a,b){
return b.value-a.value;
}
console.log(obj.sort(ascCompare)); //=>[{name:'apple',value:6600},{name:'huawei',value:3300},{name:'honor',value:2000},{name:'mi',value:1999}]
console.log(obj.sort(desCompare)); //=>[{name:'mi',value:1999},{name:'honor',value:2000},{name:'huawei',value:3300},{name:'apple',value:6600}]

解析JavaScript中的sort()排序方法以及原理的更多相关文章

  1. JavaScript中Object.prototype.toString方法的原理

    在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. ? 1 2 var arr = []; console.lo ...

  2. 模拟javascript中的sort排序

    一.javascript中sort对数据进行排序的原理 sort() 方法对数组的元素做原地的排序,并返回这个数组. sort 可能不是稳定的.默认按照字符串的Unicode码位点排序; 语法:arr ...

  3. Javascript中数组重排序方法详解

    在数组中有两个可以用来直接排序的方法,分别是reverse()和sort().下面通过本文给大家详细介绍,对js 数组重排序相关知识感兴趣的朋友一起看看吧. 1.数组中已存在两个可直接用来重排序的方法 ...

  4. JavaScript中数组的排序方法:1.冒泡排序 2.选择排序

      //1.选择排序: //从小到大排序:通过比较首先选出最小的数放在第一个位置上,然后在其余的数中选出次小数放在第二个位置上,依此类推,直到所有的数成为有序序列. var arr2=[19, 8, ...

  5. javascript中数组常用的方法和属性

    前言 在javascript中,数组是一种非常重要的数据类型,我们时常会和它打交道,最近在开发项目中频繁的使用到数组,但是自己对数组的众多方法已经是非常模糊了,为了方便自己以后能够更好的使用数组中的属 ...

  6. 深入解析Javascript中this关键字的使用

    深入解析Javascript中面向对象编程中的this关键字 在Javascript中this关键字代表函数运行时,自动生成的一个内部对象,只能在函数内部使用.比如: function TestFun ...

  7. URL地址中中文乱码详解(javascript中encodeURI和decodeURI方法、java.net.URLDecoder.encode、java.net.URLDecoder.decode)

    引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作为的参数的情况,这种情况下,一般都需要正确的设置和编码中文字符信息.乱码问题就此产生了,该如何解决呢?且听本文详细道来. ...

  8. Java开发中使用sort排序

    Java开发中使用sort排序 BaiduSpring https://baijiahao.baidu.com/s?id=1625440912158830354&wfr=spider& ...

  9. Jquery中$(document).ready() 和 JavaScript中的window.onload方法 比较

    Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的.   1.执行时间 win ...

随机推荐

  1. CPU漏洞补丁KB4056892 卸载及忽略办法

    2018.1.4微软发布了针对intel CPU漏洞的补丁 KB4056892 性能降低不说, 针对一般平民根本没多大意义, 另外还会导致一些软件无法正常使用, (我是使用蓝叠经典版, 启动就会蓝屏) ...

  2. [Day19]Collection接口中的子类(List集合、Set集合)

    1.List接口 1.1API总结 (1)是一个元素存取有序的集合 (2)是一个带有索引的集合,通过索引可以精确的操作集合中的元素 (3)集合中有可以重复的元素,通过元素的equals方法,来比较是否 ...

  3. Kali 开启 SSH 服务方法

    尝试了开启kali的ssh,方法如下: 1.修改sshd_config文件.命令:vim /etc/ssh/sshd_config 2.将#PasswordAuthentication no的注释去掉 ...

  4. 刀客139qq算命

    https://www.zhouyi.cc/bazi/sm/BaZi.php 好的算命网站 根据辛亥时看出来的午亥暗合没那么简单他不克你她太弱了婚姻不顺,是因为夫妻宫是财坏印是要比劫克财克财很重要 出 ...

  5. XSS 与 CSRF 跨站攻击

    先做个名词解释: XSS:跨站脚本(Cross-site scripting) CSRF:跨站请求伪造(Cross-site request forgery) 看了估计也不清楚什么意思吧? 那么,详细 ...

  6. NoSQL入门

    NoSQL(Not Only SQL)入门: *没有Fixed Schema *没有关系型数据储存在系统中 * 在大数据方面NoSQL有更好的表现 * 支持unstructured data - 不同 ...

  7. [vue开发记录]vue仿ios原生datepicker实现

    先上个效果图 现在只开发了年月,还在优化. 在网上看了一个纯原生js实现实现惯性滚动和回弹的文章  地址:https://www.cnblogs.com/ranyonsue/p/8119155.htm ...

  8. 为多维数组添加一列以及reshape用法注意

    https://blog.csdn.net/orangefly0214/article/details/80934008参考这个了链接 下面是我自己用到的代码,亲测可用 # data = pd.rea ...

  9. iOS 代码混淆

    一般做了防调试的话,被调试进程会退出的,是防动态分析措施. 代码混淆加花这些是防静态分析措施. 反调试是防动态分析措施. 混淆的方法方法名混淆其实就是字符串替换,有2个方法可以,一个是#define, ...

  10. macOS 版微信小助手,支持微信多开、防撤回、远程控制mac、自动回复等等

    微信小助手 GitHub大牛提供的微信小助手是一款插件,该插件具备多开.防撤回.免手机认证登录.自动回复.远程控制自己的 macOS.群发等众多功能 GitHub网址:https://github.c ...