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 tablesorter.js 支持中文表格排序改进
Dec 09 Javascript
关于IE BUG与字符串截取substr的解决办法
Apr 10 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 Javascript
使用text方法获取Html元素文本信息示例
Sep 01 Javascript
跟我学习javascript的函数调用和构造函数调用
Nov 16 Javascript
微信分享调用jssdk实例
Jun 08 Javascript
nuxt.js 缓存实践
Jun 25 Javascript
详解如何理解vue的key属性
Apr 14 Javascript
Node.js 的 GC 机制详解
Jun 03 Javascript
JS中比较两个Object数组是否相等方法实例
Nov 11 Javascript
JS+HTML实现自定义上传图片按钮并显示图片功能的方法分析
Feb 12 Javascript
js实现鼠标拖曳效果
Dec 30 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 __autoload函数(自动载入类文件)的使用方法
2012/02/04 PHP
php实现递归抓取网页类实例
2015/04/03 PHP
php下载远程大文件(获取远程文件大小)的实例
2017/06/17 PHP
PHP实现的大文件切割与合并功能示例
2018/04/10 PHP
代码生成器 document.write()
2007/04/15 Javascript
JavaScript Event学习第十章 一些可替换的事件对
2010/02/10 Javascript
JavaScript中的console.trace()函数介绍
2014/12/29 Javascript
全面理解JavaScript中的闭包
2016/05/12 Javascript
JS判断是否在微信浏览器打开的简单实例(推荐)
2016/08/24 Javascript
简单谈谈gulp-changed插件
2017/02/21 Javascript
Node中使用ES6语法的基础教程
2018/01/05 Javascript
axios全局请求参数设置,请求及返回拦截器的方法
2018/03/05 Javascript
Vue 仿QQ左滑删除组件功能
2018/03/12 Javascript
vue2使用keep-alive缓存多层列表页的方法
2018/09/21 Javascript
NodeJS多种创建WebSocket监听的方式(三种)
2020/06/04 NodeJs
vue中touch和click共存的解决方式
2020/07/28 Javascript
微信小程序实现购物车功能
2020/11/18 Javascript
[26:52]LGD vs EG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
在Python的循环体中使用else语句的方法
2015/03/30 Python
python抓取文件夹的所有文件
2018/02/27 Python
python中实现将多个print输出合成一个数组
2018/04/19 Python
Python SMTP发送邮件遇到的一些问题及解决办法
2018/10/24 Python
解决python 文本过滤和清理问题
2019/08/28 Python
简单了解django文件下载方式
2020/02/10 Python
tensorflow的ckpt及pb模型持久化方式及转化详解
2020/02/12 Python
基于python3的socket聊天编程
2020/02/17 Python
Python工程师必考的6个经典面试题
2020/06/28 Python
HTML5 Plus 实现手机APP拍照或相册选择图片上传功能
2016/07/13 HTML / CSS
Lacoste澳大利亚官网:服装、鞋类及配饰
2018/11/14 全球购物
Kickers鞋英国官网:男士、女士和儿童鞋
2021/03/08 全球购物
端口镜像是怎么实现的
2014/03/25 面试题
酒店仓管员岗位职责
2015/04/01 职场文书
花田少年史观后感
2015/06/16 职场文书
教师理论学习心得体会
2016/01/21 职场文书
七年级数学教学反思
2016/02/17 职场文书
Mybatis-plus在项目中的简单应用
2021/07/01 Java/Android