JS中使用sort结合localeCompare实现中文排序实例


Posted in Javascript onJuly 23, 2014

说到表格排序,首先要说的就一定是数组的排序,因为数组排序是表格排序的基础。

JavaScript为数组提供了sort()方法用于表格排序,默认情况下该方法会使Array中的数组按照ASCII码的顺序进行排列,JavaScript还为数组提供了数组倒序的方法reverse()。

看一下示例:

 function sortArray(){

             var arrayTest = ["z",5,2,"a",32,3];

             arrayTest.sort();

             alert(arrayTest.toString());     //output:2,3,32,5,a,z

             arrayTest.reverse();

             alert(arrayTest.toString());    //output:z,a,5,32,3,2

         }

         sortArray();

呵呵,5比32还要大,很明显这不是我们想要的结果,刚才已经说过sort()方法是按照ASCII码的顺序排序的。

其实sort()方法还允许带一个函数类型的的参数,我们可以称之为比较函数,当该比较函数又可以接收两个参数,以下该函数返回值的意义:

-1:第一个参数 小于 第二个参数

0:第一个参数 等于 第二个参数

1:第一个参数 大于 第二个参数
/**

  * 比较函数

  * @param {Object} param1 要比较的参数1

           * @param {Object} param2 要比较的参数2

           * @return {Number} 如果param1 > param2 返回 1

           *                     如果param1 == param2 返回 0

           *                     如果param1 < param2 返回 -1

           */

          function compareFunc(param1,param2){

             //如果两个参数均为字符串类型

             if(typeof param1 == "string" && typeof param2 == "string"){

                 return param1.localeCompare(param2);

             }

             //如果参数1为数字,参数2为字符串

             if(typeof param1 == "number" && typeof param2 == "string"){

                 return -1;

             }

             //如果参数1为字符串,参数2为数字

             if(typeof param1 == "string" && typeof param2 == "number"){

                 return 1;

             }

             //如果两个参数均为数字

             if(typeof param1 == "number" && typeof param2 == "number"){

                 if(param1 > param2) return 1;

                 if(param1 == param2) return 0;

                 if(param1 < param2) return -1;

             }

         }

当我们执行arrayTest.sort(compareFunc)时我们就得到了正确的结果。
到这里,我们不得不说明一下localeCompare()方法的用法,该方法是对字符串进行排序的方法,只有一个参数即要比较的字符串。

具体说明如下:

1、如果String对象按照字母顺序排在参数中的字符串之前,返回负数
2、如果String对象按照字符顺序排在参数中的字符串之后,返回正数
3、如果String对象等于参数中的字符串返回0

除此之外,localeCompare()方法还有一个独特之处,这个独特之处可以在其方法签名locale(现场、当地)上得以体现,也就是说他的实现时按照区域特性来的,如果在英语体系中,他的实现可能是按照字符串升序,如果在汉语中,他的实现则是按照首字母的拼音。

呵呵,这也就是说就算我们在程序中涉及汉字,我们的排序也不回出错。
参考以下程序:

var testArray = ["脚","本","之","家"];

         document.write(testArray.sort(

             function compareFunction(param1,param2){

                 return param1.localeCompare(param2);  //output:之,家,本,脚

             }

         ));
Javascript 相关文章推荐
原生js实现查找/添加/删除/指定元素的class
Apr 12 Javascript
jQuery的position()方法详解
Jul 19 Javascript
JS实现重新加载当前页面或者父页面的几种方法
Nov 30 Javascript
html中通过JS获取JSON数据并加载的方法
Nov 30 Javascript
Angular4学习教程之DOM属性绑定详解
Jan 04 Javascript
CKEditor4配置与开发详细中文说明文档
Oct 08 Javascript
Layui多选只有最后一个值的解决方法
Sep 02 Javascript
echarts实现折线图的拖拽效果
Dec 19 Javascript
浅析vue cli3 封装Svgicon组件正确姿势(推荐)
Apr 27 Javascript
Vue + Element-ui的下拉框el-select获取额外参数详解
Aug 14 Javascript
多个Vue项目部署到服务器的步骤记录
Oct 22 Javascript
JS实现刷新网页后之前浏览位置保持不变示例详解
Aug 14 Javascript
JS在IE下缺少标识符的错误
Jul 23 #Javascript
教你如何在 Javascript 文件里使用 .Net MVC Razor 语法
Jul 23 #Javascript
js监控IE火狐浏览器关闭、刷新、回退、前进事件
Jul 23 #Javascript
Javascript的&amp;&amp;和||的另类用法
Jul 23 #Javascript
jQuery获取节点和子节点文本的方法
Jul 22 #Javascript
jQuery打印图片pdf、txt示例代码
Jul 22 #Javascript
JavaScript匿名函数与委托使用示例
Jul 22 #Javascript
You might like
PHP实现将textarea的值根据回车换行拆分至数组
2015/06/10 PHP
php使用ZipArchive函数实现文件的压缩与解压缩
2015/10/27 PHP
自己整理的一个javascript日期处理函数
2010/10/16 Javascript
jQuery实战之品牌展示列表效果
2011/04/10 Javascript
基于jquery的大众点评,分类导航实现代码
2011/08/23 Javascript
jQuery1.6 使用方法二
2011/11/23 Javascript
JS 修改URL参数(实现代码)
2013/07/08 Javascript
js身份证判断方法支持15位和18位
2014/03/18 Javascript
javascript实现的闭包简单实例
2015/07/17 Javascript
js实现向右横向滑出的二级菜单效果
2015/08/27 Javascript
javascript的 {} 语句块详解
2016/02/27 Javascript
JS函数的定义与调用方法推荐
2016/05/12 Javascript
微信小程序-详解数据缓存
2016/11/24 Javascript
vue教程之toast弹框全局调用示例详解
2020/08/24 Javascript
Vue.js进阶知识点总结
2018/04/01 Javascript
angularjs实现的购物金额计算工具示例
2018/05/08 Javascript
浅谈让你的代码更简短,更整洁,更易读的ES6小技巧
2018/10/25 Javascript
微信小程序自定义toast组件的方法详解【含动画】
2019/05/11 Javascript
Vue实现手机计算器
2020/08/17 Javascript
ES5和ES6中类的区别总结
2020/12/21 Javascript
Vue实现省市区三级联动
2020/12/27 Vue.js
[48:48]VGJ.T vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
利用标准库fractions模块让Python支持分数类型的方法详解
2017/08/11 Python
解决已经安装requests,却依然提示No module named requests问题
2018/05/18 Python
python用fsolve、leastsq对非线性方程组求解
2018/12/15 Python
python xpath获取页面注释的方法
2019/01/14 Python
python判断链表是否有环的实例代码
2020/01/31 Python
详解Windows下PyCharm安装Numpy包及无法安装问题解决方案
2020/06/18 Python
简单了解Python字典copy与赋值的区别
2020/09/16 Python
python3爬虫中多线程的优势总结
2020/11/24 Python
普罗米修斯教学反思
2014/02/06 职场文书
2014年党员学习“三严三实”思想汇报
2014/09/15 职场文书
信用卡催款律师函
2015/05/27 职场文书
优质护理心得体会
2016/01/22 职场文书
python实现股票历史数据可视化分析案例
2021/06/10 Python
java实现面板之间切换功能
2022/06/10 Java/Android