javascript中sort() 方法使用详解


Posted in Javascript onAugust 30, 2015

语法:arrayObject.sort(sortby);参数sortby可选。规定排序顺序。必须是函数。

sort() 方法用于对数组的元素进行排序。

如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,

首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。

比较函数应该具有两个参数 a 和 b,其返回值如下:

 若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。

 若 a 等于 b,则返回 0。

 若 a 大于 b,则返回一个大于 0 的值。

 用js中的sort()方法排序数字

<script>
  var arr = [23,12,1,34,116,8,18,37,56,50];
  alert(arr.sort();
</script>

 

返回:[1, 116, 12, 18, 23, 34, 37, 50, 56, 8]

上面的代码没有按照数值的大小对数字进行排序,要实现这一点,就必须使用一个排序函数:

<script>
  var arr = [23,12,1,34,116,8,18,37,56,50];
  function sequence(a,b){
    if (a>b) {
      return 1;
    }else if(a<b){
      return -1
    }else{
      return 0;
    }
  }
  console.log(arr.sort(sequence));
</script>

返回:[1, 8, 12, 18, 23, 34, 37, 50, 56, 116] (没有问题)

当然也可以把排序函数写到sort()方法里面:

<script>
  var arr = [23,12,1,34,116,8,18,37,56,50];
  var arr2 = arr.sort(function(a,b){
     if (a>b) {
      return 1;
    }else if(a<b){
      return -1
    }else{
      return 0;
    }  
  })
  console.log(arr2);
</script>

返回:[1, 8, 12, 18, 23, 34, 37, 50, 56, 116] (也没有问题)

也可以简化成这样的写法
因为:若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。

若 a 等于 b,则返回 0。

若 a 大于 b,则返回一个大于 0 的值

<script>
   var arr = [23,12,1,34,116,8,18,37,56,50];
   function sequence(a,b){
     return a - b;
   }
   console.log(arr.sort(sequence));
 </script>

返回:[1, 8, 12, 18, 23, 34, 37, 50, 56, 116] (也是正确的)

关系字母顺序进行排序 就简单多了,直接用sort()方法就OK了:

<script>
   var arr = ['fanda','banner','find','zoom','index','width','javascript'];
   console.log(arr.sort());
 </script>

返回:["banner", "fanda", "find", "index", "javascript", "width", "zoom"]

 现在在学习javascript中,发现sort()函数是有点奇怪的东西(可能是本人水平的问题-_-!),于是就在这里记录一下自己找到的东西吧。sort()这个方法的参数很奇怪,必须是函数,但也是可选参数,如果没有参数的话,就会默认以字符串的字典顺序来排列(就算是数值,也会被转化为字符串来处理)。这个参数是要能够比较两个值的大小,如:

function sortNumber(a, b){

   return a - b; //这里返回的是他们的差值,如果是小于0的值,就会将a排在前面,如果大于0,就会将b排在前面,如果是0的话,就随便。(冒泡排序法!!)

}

 应用如下(这个例子太经典了!!):

<script type="text/javascript">
function sortNumber(a,b){return a - b}
var arr = new Array(3)
arr[0] = "10";
arr[1] = "5";
arr[2] = "4";
document.write(arr + "<br />");
document.write(arr.sort(sortNumber));
</script>

那么原本是10,5,4的排列就会变成4,5,10.这里说明一下这个过程,明明sortNumber应该是有两个参数,但是我们在调用时却一个参数都没有,怎么进行比较啊?这里是这样的,当arr从第一个数开始调用sort时,10前面是没有数与它比较的,所以就到第二个,就是5,这时10就会与5比较,于是就会调用sortNumber并将10和5传进去,这是sort()的特性。

Javascript 相关文章推荐
jQuery 中使用JSON的实现代码
Dec 01 Javascript
js判断url是否有效的两种方法
Mar 04 Javascript
js控制当再次点击按钮时的间隔时间
Jun 03 Javascript
jQuery中dequeue()方法用法实例
Dec 29 Javascript
基于jQuery Ajax实现上传文件
Mar 24 Javascript
javaScript如何跳出多重循环break、continue
Sep 01 Javascript
详解在React.js中使用PureComponent的重要性和使用方式
Jul 10 Javascript
cnpm加速Angular项目创建的方法
Sep 07 Javascript
微信小程序-可移动菜单的实现过程详解
Jun 24 Javascript
TypeScript类型声明书写详解
Aug 28 Javascript
js获取浏览器地址(获取第1个斜杠后的内容)
Sep 03 Javascript
使用Promise封装小程序wx.request的实现方法
Nov 13 Javascript
javascript中的正则表达式使用详解
Aug 30 #Javascript
jQuery鼠标事件汇总
Aug 30 #Javascript
简单谈谈javascript中的变量、作用域和内存问题
Aug 30 #Javascript
jquery专业的导航菜单特效代码分享
Aug 29 #Javascript
js实现基于正则表达式的轻量提示插件
Aug 29 #Javascript
js精美的幻灯片画集特效代码分享
Aug 29 #Javascript
jQuery实现淡入淡出二级下拉导航菜单的方法
Aug 28 #Javascript
You might like
PHP中使用foreach()遍历二维数组的简单实例
2016/06/13 PHP
Laravel5.5 视图 - 创建视图和数据传递示例
2019/10/21 PHP
Web开发者必备的12款超赞jQuery插件
2010/12/03 Javascript
放弃用你的InnerHTML来输出HTML吧 jQuery Tmpl不详细讲解
2013/04/20 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
2015/05/19 Javascript
jquery实现删除一个元素后面的所有元素功能
2015/12/21 Javascript
AngularJs 弹出模态框(model)
2016/04/07 Javascript
jQuery简单实现页面元素置顶时悬浮效果示例
2016/08/01 Javascript
js检查是否关闭浏览器的方法
2016/08/02 Javascript
Angular2 (RC4) 路由与导航详解
2016/09/21 Javascript
3种不同的ContextMenu右键菜单实现代码
2016/11/03 Javascript
jQuery开源组件BootstrapValidator使用详解
2017/06/29 jQuery
基于AngularJS实现表单验证功能
2017/07/28 Javascript
node.js学习之事件模块Events的使用示例
2017/09/28 Javascript
使用socket.io实现简单聊天室案例
2018/01/02 Javascript
一种angular的方法级的缓存注解(装饰器)
2018/03/13 Javascript
vue+axios实现文件下载及vue中使用axios的实例
2018/09/21 Javascript
nodejs npm错误Error:UNKNOWN:unknown error,mkdir 'D:\Develop\nodejs\node_global'at Error
2019/03/02 NodeJs
解决layer.open后laydate失效的问题
2019/09/06 Javascript
js节流防抖应用场景,以及在vue中节流防抖的具体实现操作
2020/09/21 Javascript
微信小程序自定义tabBar的踩坑实践记录
2020/11/06 Javascript
Python Trie树实现字典排序
2014/03/28 Python
Python中的多行注释文档编写风格汇总
2016/06/16 Python
Django自定义插件实现网站登录验证码功能
2017/04/19 Python
Python3下错误AttributeError: ‘dict’ object has no attribute’iteritems‘的分析与解决
2017/07/06 Python
PyQt5 窗口切换与自定义对话框的实例
2019/06/20 Python
python 基于dlib库的人脸检测的实现
2019/11/08 Python
一篇文章搞懂python的转义字符及用法
2020/09/03 Python
Python+Selenium随机生成手机验证码并检查页面上是否弹出重复手机号码提示框
2020/09/21 Python
用python制作个视频下载器
2021/02/01 Python
商务助理岗位职责
2013/11/13 职场文书
《十六年前的回忆》教学反思
2014/02/14 职场文书
党员廉洁自律承诺书
2014/05/26 职场文书
教师党员公开承诺事项
2014/05/28 职场文书
2015年工商局个人工作总结
2015/07/23 职场文书
建立共青团委员会的请示
2019/04/02 职场文书