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 相关文章推荐
Javascript 通过json自动生成Dom的代码
Apr 01 Javascript
兼容IE与firefox火狐的回车事件(js与jquery)
Oct 20 Javascript
SWFObject基本用法实例分析
Jul 20 Javascript
基于AngularJs + Bootstrap + AngularStrap相结合实现省市区联动代码
May 30 Javascript
smartupload实现文件上传时获取表单数据(推荐)
Dec 12 Javascript
JavaScript实现简易的天数计算器实例【附demo源码下载】
Jan 18 Javascript
jQuery控制元素隐藏和显示
Mar 03 Javascript
webpack css加载和图片加载的方法示例
Sep 11 Javascript
基于JavaScript实现一个简单的Vue
Sep 26 Javascript
代码实例ajax实现点击加载更多数据图片
Oct 12 Javascript
vue 内置过滤器的使用总结(附加自定义过滤器)
Dec 11 Javascript
JavaScript中的各种宽高属性的实现
May 08 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
网站导致浏览器崩溃的原因总结(多款浏览器) 推荐
2010/04/15 Javascript
jQuery EasyUI API 中文文档 - Spinner微调器使用
2011/10/21 Javascript
javascript判断office版本示例
2014/04/11 Javascript
jquery css 设置table的奇偶行背景色示例
2014/06/03 Javascript
JavaScript函数作用域链分析
2015/02/13 Javascript
无刷新上传文件并返回自定义值
2015/06/11 Javascript
JavaScript中定义对象原型的两种使用方法
2016/12/15 Javascript
JavaScript验证知识整理
2017/03/24 Javascript
jquery 键盘事件的使用方法详解
2017/09/13 jQuery
vue中使用heatmapjs的示例代码(结合百度地图)
2018/09/05 Javascript
vue项目打包部署_nginx代理访问方法详解
2018/09/20 Javascript
javascript自定义日期比较函数用法示例
2019/07/22 Javascript
[48:12]Secret vs Optic Supermajor 胜者组 BO3 第三场 6.4
2018/06/05 DOTA
windows下python模拟鼠标点击和键盘输示例
2014/02/28 Python
跟老齐学Python之玩转字符串(1)
2014/09/14 Python
简单介绍Python中的struct模块
2015/04/28 Python
Python中使用asyncio 封装文件读写
2016/09/11 Python
Python入门_浅谈字符串的分片与索引、字符串的方法
2017/05/16 Python
Python中装饰器高级用法详解
2017/12/25 Python
Python一句代码实现找出所有水仙花数的方法
2018/11/13 Python
解决vscode python print 输出窗口中文乱码的问题
2018/12/03 Python
Django实现简单网页弹出警告代码
2019/11/15 Python
python队列原理及实现方法示例
2019/11/27 Python
PyCharm MySQL可视化Database配置过程图解
2020/06/09 Python
python如何使用代码运行助手
2020/07/03 Python
仪器仪表检测毕业生自荐信
2013/10/31 职场文书
电子技术专业中专生的自我评价
2013/12/17 职场文书
工作自我评价怎么写
2014/01/29 职场文书
索桥的故事教学反思
2014/02/06 职场文书
个性与发展自我评价
2014/02/11 职场文书
大学生自我评价范文
2015/03/03 职场文书
丧事酒宴答谢词
2015/09/30 职场文书
咖啡厅里的创业计划书
2019/08/21 职场文书
nginx的zabbix 5.0安装部署的方法步骤
2021/07/16 Servers
关于python pygame游戏进行声音添加的技巧
2021/10/24 Python
zabbix 代理服务器的部署与 zabbix-snmp 监控问题
2022/07/15 Servers