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 相关文章推荐
Javascript入门学习资料收集整理篇
Jul 06 Javascript
.net,js捕捉文本框回车键事件的小例子(兼容多浏览器)
Mar 11 Javascript
现如今最流行的JavaScript代码规范
Mar 08 Javascript
跟我学Node.js(四)---Node.js的模块载入方式与机制
Jun 04 Javascript
javascript中call和apply的用法示例分析
Apr 02 Javascript
javascript简单实现类似QQ头像弹出效果的方法
Aug 03 Javascript
JavaScript实现网站访问次数统计代码
Aug 12 Javascript
原生 JS Ajax,GET和POST 请求实例代码
Jun 08 Javascript
jquery与ajax获取特殊字符实例详解
Jan 08 Javascript
JS实现向iframe中表单传值的方法
Mar 24 Javascript
一文读懂ES7中的javascript修饰器
May 06 Javascript
使用vue构建多页面应用的示例
Oct 22 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
mysql limit查询优化分析
2008/11/12 PHP
php学习笔记 [预定义数组(超全局数组)]
2011/06/09 PHP
php实现文件下载功能的几个代码分享
2014/05/10 PHP
ThinkPHP之import方法实例详解
2014/06/20 PHP
PHP开发APP端微信支付功能
2017/02/17 PHP
php输出形式实例整理
2020/05/05 PHP
深入浅析安装PhpStorm并激活的步骤详解
2020/09/17 PHP
JS+CSS实现带关闭按钮DIV弹出窗口的方法
2015/02/27 Javascript
js判断手机号运营商的方法
2015/10/23 Javascript
原生js实现数字字母混合验证码的简单实例
2015/12/10 Javascript
一道关于JavaScript变量作用域的面试题
2016/03/08 Javascript
Node.js中使用jQuery的做法
2016/08/17 Javascript
浅谈webpack下的AOP式无侵入注入
2017/11/12 Javascript
详解webpack babel的配置
2018/01/09 Javascript
VueJS 组件参数名命名与组件属性转化问题
2018/12/03 Javascript
浅谈layer弹出层按钮颜色修改方法
2019/09/11 Javascript
js实现坦克大战游戏
2020/02/24 Javascript
node创建Vue项目步骤详解
2020/03/06 Javascript
python多重继承实例
2014/10/11 Python
Python中的装饰器用法详解
2015/01/14 Python
python使用win32com库播放mp3文件的方法
2015/05/30 Python
Python爬虫辅助利器PyQuery模块的安装使用攻略
2016/04/24 Python
如何在python中处理配置文件代码实例
2020/09/27 Python
CSS3实现多重边框的方法总结
2016/05/31 HTML / CSS
amazeui时间组件的实现示例
2020/08/18 HTML / CSS
新闻学毕业生自荐信
2013/11/15 职场文书
物流仓管员工作职责
2014/01/06 职场文书
年终考核评语
2014/01/19 职场文书
报纸媒体创意广告词
2014/03/17 职场文书
班子四风对照检查材料思想汇报
2014/09/29 职场文书
一次性工伤赔偿协议书范本
2014/11/25 职场文书
大学生毕业个人总结
2015/02/15 职场文书
员工辞职信怎么写
2015/02/27 职场文书
企业爱心捐款倡议书
2015/04/27 职场文书
为什么MySQL分页用limit会越来越慢
2021/07/25 MySQL
关于springboot 配置date字段返回时间戳的问题
2021/07/25 Java/Android