js怎样实现中文拼音的A-Z排序
这次给大家带来js怎样实现中文拼音的A-Z排序,js实现中文拼音的A-Z排序的注意事项有哪些,下面就是实战案例,一起来看一下。
实现中文按照A-Z的方法,可以在vue的methods里面写入:
methods:{ pySort:function(arr,empty){ var $this = this; if(!String.prototype.localeCompare) return null; var letters = "ABCDEFGHJKLMNOPQRSTWXYZ".split(''); var zh = "阿八嚓哒妸发旮哈讥咔垃痳拏噢妑七呥扨它穵夕丫帀".split(''); var arrList = []; for(var m =0;m<arr.length;m++){ arrList.push(arr[m].name); } var result = []; var curr; for(var i=0;i<letters.length;i++){ curr = {letter: letters[i], data:[]}; if(i!=26){ for(var j =0;j<arrList.length;j++){ var initial = arrList[j].charAt(0);//截取第一个字符 if(arrList[j].charAt(0)==letters[i]||arrList[j].charAt(0)==letters[i].toLowerCase()){ //首字符是英文的 curr.data.push(arrList[j]); }else if(zh[i]!='*'&&$this.isChinese(initial)){ //判断是否是无汉字,是否是中文 if(initial.localeCompare(zh[i]) >= 0 &&(!zh[i+1]||initial.localeCompare(zh[i+1]) <0)) { //判断中文字符在哪一个类别 curr.data.push(arrList[j]); } } } }else{ for(var k =0;k<arrList.length;k++){ var ini = arrList[k].charAt(0); //截取第一个字符 if(!$this.isChar(ini)&&!$this.isChinese(ini)){ curr.data.push(arrList[k]); } } } if(empty || curr.data.length) { result.push(curr); //curr.data.sort(function(a,b){ // return b.localeCompare(a); //排序,英文排序,汉字排在英文后面 //}); } } return result; }, isChinese:function(temp){ var re=/[^\u4E00-\u9FA5]/; if (re.test(temp)){return false;} return true ; }, isChar:function(char){ var reg = /[A-Za-z]/; if (!reg.test(char)){return false ;} return true ; } }
将从php中获取的json对象转换成数组,vue中直接调用->this.pySort(arr); js直接调用pySort(arr)方法即可 即可实现按照A-Z的格式排序
如下图在控制台输出的格式:
letter中存放键值A-Z
data:存放排序后的数组
至于vue中需要放在页面中,使用v-for循环即可 v-for="(key,value) in arr"
需要获取data数组的值,继续使用v-for="tmp in (key.data)"循环在你想输入摆放的元素中
写的比较简单,这个方法在js中也通用
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
以上是js怎样实现中文拼音的A-Z排序的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

本文将介绍如何在Windows11/10中根据拍摄日期对图片进行排序,同时探讨如果Windows未按日期排序图片应该如何处理。在Windows系统中,合理整理照片对于方便查找图像文件至关重要。用户可以根据不同的排序方式(如日期、大小和名称)来管理包含照片的文件夹。此外,还可以根据需要设置升序或降序排列,以便更灵活地组织文件。如何在Windows11/10中按拍摄日期对照片进行排序要按在Windows中拍摄的日期对照片进行排序,请执行以下步骤:打开图片、桌面或放置照片的任何文件夹在功能区菜单中,单

Outlook提供了许多设置和功能,可帮助您更有效地管理工作。其中之一是排序选项,可让您根据需要对电子邮件进行分类。在这个教程中,我们将学习如何利用Outlook的排序功能,根据发件人、主题、日期、类别或大小等条件对电子邮件进行整理。这将让您更轻松地处理和查找重要信息,提高工作效率。MicrosoftOutlook是一个功能强大的应用程序,可以方便地集中管理您的电子邮件和日历安排。您可以轻松地发送、接收和组织电子邮件,而内置的日历功能也让您能够方便地跟踪您即将面临的活动和约会。如何在Outloo

如何使用WebSocket和JavaScript实现在线语音识别系统引言:随着科技的不断发展,语音识别技术已经成为了人工智能领域的重要组成部分。而基于WebSocket和JavaScript实现的在线语音识别系统,具备了低延迟、实时性和跨平台的特点,成为了一种被广泛应用的解决方案。本文将介绍如何使用WebSocket和JavaScript来实现在线语音识别系

WebSocket与JavaScript:实现实时监控系统的关键技术引言:随着互联网技术的快速发展,实时监控系统在各个领域中得到了广泛的应用。而实现实时监控的关键技术之一就是WebSocket与JavaScript的结合使用。本文将介绍WebSocket与JavaScript在实时监控系统中的应用,并给出代码示例,详细解释其实现原理。一、WebSocket技

如何利用JavaScript和WebSocket实现实时在线点餐系统介绍:随着互联网的普及和技术的进步,越来越多的餐厅开始提供在线点餐服务。为了实现实时在线点餐系统,我们可以利用JavaScript和WebSocket技术。WebSocket是一种基于TCP协议的全双工通信协议,可以实现客户端与服务器的实时双向通信。在实时在线点餐系统中,当用户选择菜品并下单

如何使用WebSocket和JavaScript实现在线预约系统在当今数字化的时代,越来越多的业务和服务都需要提供在线预约功能。而实现一个高效、实时的在线预约系统是至关重要的。本文将介绍如何使用WebSocket和JavaScript来实现一个在线预约系统,并提供具体的代码示例。一、什么是WebSocketWebSocket是一种在单个TCP连接上进行全双工

在我们的工作中,经常会用到wps软件,wps软件处理数据的方式方法是非常多的,而且函数功能也是非常强大的,我们经常用函数来求平均值,求汇总等,可以说只要是统计数据能用的方法,wps软件库里都已经为大家准备好了,下面我们要介绍的是wps怎么排序成绩高低的操作步骤,看完以后大家可以借鉴一下经验。1、首先打开需要排名的表格。如下图所示。 2、然后输入公式=rank(B2,B2:B5,0),一定要输入0。如下图所示。 3、输入完公式以后,按下电脑键盘上的F4键,这步操作是为了让相对引用变为绝对引用。

Ubuntu系统中使用拼音输入法无法正确打字,输入法上显示出来的字和你想打的字并不相关,你无法打出你想要输入的汉字,这种现象比较常出现在升级Ubuntu系统后。我们该怎么解决这个问题呢?下面小编就为大家带来Ubuntu系统拼音无法正确打字的解决方法。一起去看看吧!方法如下:1、在桌面按“Ctrl”+“Alt”+“T”,打开系统终端:2、在终端里面输入ibus-daemon-drx并回车:ibus-daemon-drx再输入pinyin
