JavaScript实现拼音排序的方法


Posted in Javascript onNovember 20, 2012

一般情况下,大家会使用下面的方法来进行汉字的拼音排序

var list = [ '王', '张','李']; 
list.sort(function (a, b) { 
return a.localeCompare(b); 
});

localeCompare() :用本地特定的顺序来比较两个字符串。
通过localeCompare这个方法来进行拼音排序的不可靠之处在于:
1. 很依赖中文操作系统
2. 很依赖浏览器的内核
也就是说,如果你的网站访问者是通过非中文系统,或者非IE浏览器(如Chrome),那么他将很可能无法看到我们所预期的拼音排序结果。
--------------------------------------------------------------------------------
下面介绍一下我解决这个问题的办法,希望能抛砖引玉哈:
本方法支持Unicode字符集中从0x4E00到 0x9FA5 的连续区域内共20902个来自中国(包括台湾)、日本、韩国的汉字,即CJK(Chinese Japanese Korean)汉字。
var CompareStrings = { 
db: '吖阿啊锕?嗄哎哀...???????', // 其中省略几万字 
getOrderedUnicode: function (char) { 
var originalUnicode = char.charCodeAt(); 
if (originalUnicode >= 0x4E00 && originalUnicode <= 0x9FA5) { 
var index = this.db.indexOf(char); 
if (index > -1) { 
return index + 0x4E00; 
} 
} 
return originalUnicode; 
}, 
compare: function (a, b) { 
if (a == b) {return 0; 
} 
// 这里可以根据具体需求来改写,目前的写法是把空字符串排在最后if (a.length == 0) { return 1; } 
if (b.length == 0) { return -1; } 
var count = a.length > b.length ? b.length : a.length; 
for (var i = 0; i < count; i++) { 

var au = this.getOrderedUnicode(a[i]); 

var bu = this.getOrderedUnicode(b[i]); 

if (au > bu) { 

 return 1; 

} else if (au < bu) { 

 return -1; 

} 
} 
return a.length > b.length ? 1 : -1; 
 } 
} 
// 重写系统原生的localeCompare 
String.prototype.localeCompare = function (param) { 

return CompareStrings.compare(this.toString(), param); 
}

大家可以通过下面的链接下载到完整代码 http://xiazai.3water.com/201211/yuanma/js_pinyin_3water.rar
简单介绍一下实现的原理:
1. 取得按拼音排序好的字库(db):有多种途径可以达到目的,我是用JavaScript+C#组合完成的,先用脚本把所有汉字枚举出来,再提交到C#后台排序好,再输出到前台,这个只是准备工作哈,怎么搞都可以。
2. 确定两个字符谁比较大(getOrderedUnicode):因为排序的时候,不光要处理汉字,还要处理汉字以外的字符,所以比较器必须能识别所有的字符,这里我们通过判断一个字符是否是汉字来区别对待:如果是汉字,那么就在排序好的字库里搜索它的索引值,得到的索引值再加上Unicode字符集中第一个汉字所处的位置,就是在“校准”以后的Unicode字符集中的索引值了;如果不是汉字,那么就直接返回它在Unicode字符集中的索引值即可。
3. 比较两个字符串(compare):逐一比较两个字符串中的每一个字符(在有效范围内比较,也就是较短的那个字符串的长度),如果发现a比b大,就返回1,反之返回-1。
4. 在有效范围内比较结束后如果还没分出胜负,就看谁比较长,例如a='123',b='1234',那么较长的b要排在后面。
绿色通道: 好文要顶 关注我 收藏该文与我联系
Javascript 相关文章推荐
Div Select挡住的解决办法
Aug 07 Javascript
extJs 文本框后面加上说明文字+下拉列表选中值后触发事件
Nov 27 Javascript
jquery isEmptyObject判断是否为空对象的函数
Feb 14 Javascript
为什么要在引入的css或者js文件后面加参数的详细讲解
May 03 Javascript
页面元素绑定jquery toggle后元素隐藏的解决方法
Mar 27 Javascript
JavaScript实现继承的4种方法总结
Oct 16 Javascript
JQuery中使用.each()遍历元素学习笔记
Nov 08 Javascript
javascript实现给定半径求出圆的面积
Jun 26 Javascript
基于jQuery Easyui实现登陆框界面
Jul 10 jQuery
基于javascript的拖拽类封装详解
Apr 19 Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 Javascript
Vue项目页面跳转时浏览器窗口上方显示进度条功能
Mar 26 Javascript
Js+Flash实现访问剪切板操作
Nov 20 #Javascript
利用JQuery和JS实现奇偶行背景颜色自定义效果
Nov 19 #Javascript
jQuery 数据缓存模块进化史详细介绍
Nov 19 #Javascript
基于jquery库的tab新形式使用
Nov 16 #Javascript
jquery getScript动态加载JS方法改进详解
Nov 15 #Javascript
javascript 图片裁剪技巧解读
Nov 15 #Javascript
中国地区三级联动下拉菜单效果分析
Nov 15 #Javascript
You might like
剖析 PHP 中的输出缓冲
2006/12/21 PHP
PHP引用的调用方法分析
2016/04/25 PHP
laravel-admin的图片删除实例
2019/09/30 PHP
javascript字典探测用户名工具
2006/10/05 Javascript
JavaScript中输出标签的方法
2014/08/27 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
2015/01/13 Javascript
JavaScript实现可拖拽的拖动层Div实例
2015/08/05 Javascript
javascript常用经典算法实例详解
2015/11/25 Javascript
深入理解jQuery layui分页控件的使用
2016/08/17 Javascript
Bootstrap图片轮播组件Carousel使用方法详解
2016/10/20 Javascript
JavaScript正则表达式exec/g实现多次循环用法示例
2017/01/17 Javascript
jquery表单验证实例仿Toast提示效果
2017/03/03 Javascript
Angular2平滑升级到Angular4的步骤详解
2017/03/29 Javascript
Promise.all中对于reject的处理方法
2018/08/01 Javascript
jQuery实现的页面弹幕效果【测试可用】
2018/08/17 jQuery
jQuery实现的网站banner图片无缝轮播效果完整实例
2019/01/28 jQuery
vue+vant实现购物车全选和反选功能
2020/11/17 Vue.js
[03:41]2018完美盛典-《Fight With Us》
2018/12/16 DOTA
python中的hashlib和base64加密模块使用实例
2014/09/02 Python
使用Python AIML搭建聊天机器人的方法示例
2018/07/09 Python
Python多继承原理与用法示例
2018/08/23 Python
Python使用logging模块实现打印log到指定文件的方法
2018/09/05 Python
python字典一键多值实例代码分享
2019/06/14 Python
python实现对列表中的元素进行倒序打印
2019/11/23 Python
Python爬虫基于lxml解决数据编码乱码问题
2020/07/31 Python
详解python对象之间的交互
2020/09/29 Python
加利福尼亚州威尼斯的女性奢侈品设计师服装和概念店:Mona Moore
2018/09/13 全球购物
AJAX都有哪些有点和缺点
2012/11/03 面试题
销售工作人员的自我评价分享
2013/11/10 职场文书
应届大专毕业生自我鉴定
2014/04/08 职场文书
拓展策划方案
2014/06/03 职场文书
2014学习优秀共产党员先进事迹思想汇报
2014/09/14 职场文书
鸟的天堂导游词
2015/01/31 职场文书
酒店工程部主管岗位职责
2015/04/16 职场文书
2015年远程教育工作总结
2015/05/20 职场文书
聘用合同范本
2015/09/21 职场文书