当前位置:主页 > javascript教程 > 利用JavaScript对中文(汉字)进行排序实例详解

利用JavaScript对中文进行排序的实例代码

发布:2019-11-29 08:57:48 109


给大家整理一篇JS排序相关的编程文章,网友莘文瑶根据主题投稿了本篇教程内容,涉及到javascript、汉字排序、javascript、中文排序、排序、利用JavaScript对中文(汉字)进行排序实例详解相关内容,已被385网友关注,内容中涉及的知识点可以在下方直接下载获取。

利用JavaScript对中文(汉字)进行排序实例详解

前言

在网页上展示列表时经常需要对列表进行排序:按照修改/访问时间排序、按照地区、按照名称排序。

对于中文列表按照名称排序就是按照拼音排序,不能简单通过字符串比较—— ‘a' > ‘b'——这种方式来实现。

比如比较 ‘北京' vs ‘上海',实际是比较 ‘běijīng' vs ‘shànghǎi';比较 ‘北京' vs ‘背景',实际是比较 ‘běijīng' vs ‘bèijǐng'。

一般需要获取到字符串的拼音,再比较各自的拼音。

实现方法

JavaScript 提供本地化文字排序,比如对中文按照拼音排序,不需要程序显示比较字符串拼音。

String.prototype.localeCompare 在不考虑多音字的前提下,基本可以完美实现按照拼音排序。

在没有出现意外的情况下,各个支持 localeCompare 的浏览器都很正常。最近将 Chrome 更新到 58.0.3029.110,突然发现中文排序不正常。

// 正常应该返回 1, 拼音 jia 在前, kai 在后
'开'.localeCompare('驾');
// 得到
-1;
 
// Chrome 58.0.3029.110 下返回 -1, 其他浏览器正常
 
// 确认之后是 localeCompare 需要明确指定 locales 参数
'开'.localeCompare('驾', 'zh');
// 得到
1

利用JavaScript对中文(汉字)进行排序实例详解

在 Chrome 下传递 locales 参数才能获得正常预期结果

利用JavaScript对中文(汉字)进行排序实例详解

Edge 浏览器支持 localeCompare

利用JavaScript对中文(汉字)进行排序实例详解

Firefox 浏览器支持 localeCompare

利用JavaScript对中文(汉字)进行排序实例详解

IE 11 浏览器支持 localeCompare

其他浏览器对 localeCompare 支持也很友好,目前也不需要明确传递 locales,浏览器支持参考 developer.mozilla.org

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对码农之家的支持。


参考资料

相关文章

  • 实例详解Javascript之BOM(window对象)

    发布:2020-01-08

    下面小编就为大家带来一篇Javascript之BOM(window对象)详解。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧


  • Javascript中的Array数组对象详谈

    发布:2022-11-26

    给大家整理一篇关于Javascript的教程,这篇文章主要介绍了Javascript中的Array数组对象,需要的朋友可以参考下


  • JavaScript的6种继承方式总结

    发布:2019-12-17

    继承是面向对象编程中又一非常重要的概念,JavaScript支持实现继承,不支持接口继承,实现继承主要依靠原型链来实现的


  • 掌握JavaScript中面向对象编程之概论

    发布:2020-03-11

    这篇文章主要介绍了深入理解JavaScript系列(17):面向对象编程之概论详细介绍,本文讲解了概论、范式与思想、基于类特性和基于原型、基于静态类、层次继承等内容,需要的朋友可以参考下


  • javascript之onbeforeunload、onunload事件详解

    发布:2020-03-21

    javascript中onbeforeunload与onunload事件就是页面加载前与页面关闭时的两个功能的函数,可以防止页面刷新时给提示再刷新或页面关闭时给出提示,下面我来介绍onbeforeunload与onunload事件用法。


  • 分享关于JavaScript禁用右键单击优缺点分析

    发布:2020-02-20

    在本篇文章里小编给大家分享了关于JavaScript禁用右键单击优缺点分析,有需要的朋友们学习下。


  • Javascript中import和require用法分析

    发布:2021-05-12

    本篇文章主要介绍了Javascript(es2016) import和require用法和区别详解,具有一定的参考价值,有兴趣的可以了解下


  • javaScript如何获取CSS样式

    发布:2021-05-19

    大家都知道CSS样式有三种类型:行内样式、内部样式和外部样式,这篇文章主要介绍了javaScript获取CSS样式的方法(兼容各浏览器),需要的朋友可以参考下


网友讨论