JavaScript之排序函数_动力节点Java学院整理


Posted in Javascript onJune 30, 2017

排序算法

排序也是在程序中经常用到的算法。无论使用冒泡排序还是快速排序,排序的核心是比较两个元素的大小。如果是数字,我们可以直接比较,但如果是字符串或者两个对象呢?直接比较数学上的大小是没有意义的,因此,比较的过程必须通过函数抽象出来。通常规定,对于两个元素xy,如果认为x < y,则返回-1,如果认为x == y,则返回0,如果认为x > y,则返回1,这样,排序算法就不用关心具体的比较过程,而是根据比较结果直接排序。

JavaScript的Arraysort()方法就是用于排序的,但是排序结果可能让你大吃一惊:

// 看上去正常的结果:
['Google', 'Apple', 'Microsoft'].sort(); // ['Apple', 'Google', 'Microsoft'];

// apple排在了最后:
['Google', 'apple', 'Microsoft'].sort(); // ['Google', 'Microsoft", 'apple']

// 无法理解的结果:
[10, 20, 1, 2].sort(); // [1, 10, 2, 20]

第二个排序把apple排在了最后,是因为字符串根据ASCII码进行排序,而小写字母a的ASCII码在大写字母之后。

第三个排序结果是什么鬼?简单的数字排序都能错?

这是因为Arraysort()方法默认把所有元素先转换为String再排序,结果'10'排在了'2'的前面,因为字符'1'比字符'2'的ASCII码小。

如果不知道sort()方法的默认排序规则,直接对数字排序,绝对栽进坑里!

幸运的是,sort()方法也是一个高阶函数,它还可以接收一个比较函数来实现自定义的排序。

要按数字大小排序,我们可以这么写:

var arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
  if (x < y) {
    return -1;
  }
  if (x > y) {
    return 1;
  }
  return 0;
}); // [1, 2, 10, 20]

如果要倒序排序,我们可以把大的数放前面:

var arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
  if (x < y) {
    return 1;
  }
  if (x > y) {
    return -1;
  }
  return 0;
}); // [20, 10, 2, 1]

默认情况下,对字符串排序,是按照ASCII的大小比较的,现在,我们提出排序应该忽略大小写,按照字母序排序。要实现这个算法,不必对现有代码大加改动,只要我们能定义出忽略大小写的比较算法就可以:

var arr = ['Google', 'apple', 'Microsoft'];
arr.sort(function (s1, s2) {
  x1 = s1.toUpperCase();
  x2 = s2.toUpperCase();
  if (x1 < x2) {
    return -1;
  }
  if (x1 > x2) {
    return 1;
  }
  return 0;
}); // ['apple', 'Google', 'Microsoft']

忽略大小写来比较两个字符串,实际上就是先把字符串都变成大写(或者都变成小写),再比较。

从上述例子可以看出,高阶函数的抽象能力是非常强大的,而且,核心代码可以保持得非常简洁。

最后友情提示,sort()方法会直接对Array进行修改,它返回的结果仍是当前Array

var a1 = ['B', 'A', 'C'];
var a2 = a1.sort();
a1; // ['A', 'B', 'C']
a2; // ['A', 'B', 'C']
a1 === a2; // true, a1和a2是同一对象
Javascript 相关文章推荐
如何将一个String和多个String值进行比较思路分析
Apr 22 Javascript
js中数组排序sort方法的原理分析
Nov 20 Javascript
JavaScript调用浏览器打印功能实例分析
Jul 17 Javascript
jQuery实现彩带延伸效果的网页加载条loading动画
Oct 29 Javascript
JS 60秒后重新发送验证码的实例讲解
Jul 26 Javascript
vue router下的html5 history在iis服务器上的设置方法
Oct 18 Javascript
简单实现jQuery弹窗效果
Oct 30 jQuery
webpack打包react项目的实现方法
Jun 21 Javascript
JS调用安卓手机摄像头扫描二维码
Oct 16 Javascript
vue实现与安卓、IOS交互的方法
Nov 02 Javascript
Vuex持久化插件(vuex-persistedstate)解决刷新数据消失的问题
Apr 16 Javascript
vue中destroyed方法的使用说明
Jul 21 Javascript
JavaScript操作文件_动力节点Java学院整理
Jun 30 #Javascript
JavaScript之生成器_动力节点Java学院整理
Jun 30 #Javascript
详解vue组件通信的三种方式
Jun 30 #Javascript
JavaScript实现瀑布流图片效果
Jun 30 #Javascript
十大 Node.js 的 Web 框架(快速提升工作效率)
Jun 30 #Javascript
vue.js移动端tab组件的封装实践实例
Jun 30 #Javascript
jQuery表单设置值的方法
Jun 30 #jQuery
You might like
php中可能用来加密字符串的函数[base64_encode、urlencode、sha1]
2012/01/16 PHP
学习php分页代码实例
2013/10/24 PHP
用php简单实现加减乘除计算器
2014/01/06 PHP
py文件转exe时包含paramiko模块出错解决方法
2016/08/12 PHP
PHP获取表单数据与HTML嵌入PHP脚本的实现
2017/02/09 PHP
jQuery 动画基础教程
2008/12/25 Javascript
csdn 批量接受好友邀请
2009/02/19 Javascript
Js base64 加密解密介绍
2013/10/11 Javascript
js截取字符串的两种方法及区别详解
2013/11/05 Javascript
解决linux下node.js全局模块找不到的问题
2018/05/15 Javascript
vue.js配合$.post从后台获取数据简单demo分享
2018/08/11 Javascript
socket io与vue-cli的结合使用的示例代码
2018/11/01 Javascript
如何在vue里面优雅的解决跨域(路由冲突问题)
2019/01/20 Javascript
JS实现的碰撞检测与周期移动完整示例
2019/09/02 Javascript
[40:05]DOTA2上海特级锦标赛A组小组赛#1 EHOME VS MVP.Phx第一局
2016/02/25 DOTA
用Python和MD5实现网站挂马检测程序
2014/03/13 Python
使用python实现生成用户信息
2017/03/20 Python
Go/Python/Erlang编程语言对比分析及示例代码
2018/04/23 Python
基于Python对数据shape的常见操作详解
2018/12/25 Python
Python Django 简单分页的实现代码解析
2019/08/21 Python
基于Python计算圆周率pi代码实例
2020/03/25 Python
Django分组聚合查询实例分享
2020/04/29 Python
基于python实现获取网页图片过程解析
2020/05/11 Python
python 实现socket服务端并发的四种方式
2020/12/14 Python
谈谈对css属性box-sizing的了解
2017/01/04 HTML / CSS
详解CSS3弹性伸缩盒
2020/09/21 HTML / CSS
大学生的四年学习自我评价
2013/12/13 职场文书
简单的项目建议书模板
2014/03/12 职场文书
《鲁班和橹板》教学反思
2014/04/27 职场文书
信息员培训方案
2014/06/12 职场文书
环境保护标语
2014/06/20 职场文书
房屋产权证明书
2014/10/15 职场文书
房屋租房协议书范本
2014/12/04 职场文书
中学生打架检讨书之500字
2019/08/06 职场文书
导游词之任弼时故居
2020/01/07 职场文书
python文件目录操作之os模块
2021/05/08 Python