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 相关文章推荐
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
Jun 14 Javascript
js如何获取file控件的完整路径具体实现代码
May 15 Javascript
js获取当前日期代码适用于网页头部
Jun 27 Javascript
用JS在浏览器中创建下载文件
Mar 05 Javascript
JS实现仿QQ聊天窗口抖动特效
May 10 Javascript
react+redux的升级版todoList的实现
Dec 18 Javascript
微信小程序switch组件使用详解
Jan 31 Javascript
集成vue到jquery/bootstrap项目的方法
Feb 10 jQuery
Vue 技巧之控制父类的 slot
Feb 24 Javascript
js模拟实现百度搜索
Jun 28 Javascript
小程序实现tab标签页
Nov 16 Javascript
前端vue+express实现文件的上传下载示例
Feb 18 Vue.js
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+MySQL存储数据常见中文乱码问题小结
2016/06/13 PHP
php入门教程之Zend Studio设置与开发实例
2016/09/09 PHP
键盘 keycode的值 javascript时触发事件时很有用的要素
2009/11/02 Javascript
一个js的tab切换效果代码[代码分离]
2010/04/11 Javascript
javascript Event对象详解及使用示例
2013/11/22 Javascript
js数组依据下标删除元素
2015/04/14 Javascript
jQuery实现鼠标悬停显示提示信息窗口的方法
2015/04/30 Javascript
七夕情人节丘比特射箭小游戏
2015/08/20 Javascript
node.js Sequelize实现单实例字段或批量自增、自减
2016/12/08 Javascript
JavaScript你不知道的一些数组方法
2017/08/18 Javascript
基于casperjs和resemble.js实现一个像素对比服务详解
2018/01/10 Javascript
小程序分享模块超级详解(推荐)
2019/04/10 Javascript
微信小程序实现购物车代码实例详解
2019/08/29 Javascript
Javascript类型判断相关例题及解析
2020/08/26 Javascript
[16:56]heroes英雄教学 司夜刺客
2014/09/18 DOTA
Python中使用item()方法遍历字典的例子
2014/08/26 Python
Python实现爬取需要登录的网站完整示例
2017/08/19 Python
python+matplotlib绘制旋转椭圆实例代码
2018/01/12 Python
python构建深度神经网络(DNN)
2018/03/10 Python
Python实现基于POS算法的区块链
2018/08/07 Python
Python中的异常处理try/except/finally/raise用法分析
2019/02/28 Python
基于python3 的百度图片下载器的实现代码
2019/11/05 Python
Python json转字典字符方法实例解析
2020/04/13 Python
Django全局启用登陆验证login_required的方法
2020/06/02 Python
浅析两列自适应布局的3种思路
2016/05/03 HTML / CSS
美国存储和组织商店:The Container Store
2017/08/16 全球购物
《囚绿记》教学反思
2014/03/01 职场文书
运输服务质量承诺书
2014/03/27 职场文书
班级心理活动总结
2014/07/04 职场文书
新闻编辑求职信
2014/07/13 职场文书
老公出轨后的保证书
2015/05/08 职场文书
全国劳模先进事迹材料(2016精选版)
2016/02/25 职场文书
你会写请假条吗?
2019/06/26 职场文书
MySQL数字类型自增的坑
2021/05/07 MySQL
Python 中 Shutil 模块详情
2021/11/11 Python
python编程学习使用管道Pipe编写优化代码
2021/11/20 Python