JS中使用sort結(jié)合localeCompare實(shí)現(xiàn)中文排序?qū)嵗?/h1>

 更新時(shí)間：2014年07月23日 11:09:36   投稿：junjie  

這篇文章主要介紹了JS中使用sort結(jié)合localeCompare實(shí)現(xiàn)中文排序?qū)嵗?重點(diǎn)介紹localeCompare函數(shù),需要的朋友可以參考下

說(shuō)到表格排序，首先要說(shuō)的就一定是數(shù)組的排序，因?yàn)閿?shù)組排序是表格排序的基礎(chǔ)。

JavaScript為數(shù)組提供了sort()方法用于表格排序，默認(rèn)情況下該方法會(huì)使Array中的數(shù)組按照ASCII碼的順序進(jìn)行排列，JavaScript還為數(shù)組提供了數(shù)組倒序的方法reverse()。

看一下示例：

復(fù)制代碼 代碼如下:

 function sortArray(){
             var arrayTest = ["z",5,2,"a",32,3];
             arrayTest.sort();
             alert(arrayTest.toString());     //output:2,3,32,5,a,z
             arrayTest.reverse();
             alert(arrayTest.toString());    //output:z,a,5,32,3,2
         }
         sortArray();

呵呵，5比32還要大，很明顯這不是我們想要的結(jié)果，剛才已經(jīng)說(shuō)過(guò)sort()方法是按照ASCII碼的順序排序的。

其實(shí)sort()方法還允許帶一個(gè)函數(shù)類型的的參數(shù)，我們可以稱之為比較函數(shù)，當(dāng)該比較函數(shù)又可以接收兩個(gè)參數(shù)，以下該函數(shù)返回值的意義：

復(fù)制代碼 代碼如下:

-1：第一個(gè)參數(shù) 小于 第二個(gè)參數(shù)
0：第一個(gè)參數(shù) 等于 第二個(gè)參數(shù)
1：第一個(gè)參數(shù) 大于 第二個(gè)參數(shù)

復(fù)制代碼 代碼如下:

/**
  * 比較函數(shù)
  * @param {Object} param1 要比較的參數(shù)1
           * @param {Object} param2 要比較的參數(shù)2
           * @return {Number} 如果param1 > param2 返回 1
           *                     如果param1 == param2 返回 0
           *                     如果param1 < param2 返回 -1
           */
          function compareFunc(param1,param2){
             //如果兩個(gè)參數(shù)均為字符串類型
             if(typeof param1 == "string" && typeof param2 == "string"){
                 return param1.localeCompare(param2);
             }
             //如果參數(shù)1為數(shù)字，參數(shù)2為字符串
             if(typeof param1 == "number" && typeof param2 == "string"){
                 return -1;
             }
             //如果參數(shù)1為字符串，參數(shù)2為數(shù)字
             if(typeof param1 == "string" && typeof param2 == "number"){
                 return 1;
             }
             //如果兩個(gè)參數(shù)均為數(shù)字
             if(typeof param1 == "number" && typeof param2 == "number"){
                 if(param1 > param2) return 1;
                 if(param1 == param2) return 0;
                 if(param1 < param2) return -1;
             }
         }

當(dāng)我們執(zhí)行arrayTest.sort(compareFunc)時(shí)我們就得到了正確的結(jié)果。
到這里，我們不得不說(shuō)明一下localeCompare()方法的用法，該方法是對(duì)字符串進(jìn)行排序的方法，只有一個(gè)參數(shù)即要比較的字符串。

具體說(shuō)明如下:

1、如果String對(duì)象按照字母順序排在參數(shù)中的字符串之前，返回負(fù)數(shù)
2、如果String對(duì)象按照字符順序排在參數(shù)中的字符串之后，返回正數(shù)
3、如果String對(duì)象等于參數(shù)中的字符串返回0

除此之外，localeCompare()方法還有一個(gè)獨(dú)特之處，這個(gè)獨(dú)特之處可以在其方法簽名locale(現(xiàn)場(chǎng)、當(dāng)?shù)?上得以體現(xiàn)，也就是說(shuō)他的實(shí)現(xiàn)時(shí)按照區(qū)域特性來(lái)的，如果在英語(yǔ)體系中，他的實(shí)現(xiàn)可能是按照字符串升序，如果在漢語(yǔ)中，他的實(shí)現(xiàn)則是按照首字母的拼音。

呵呵，這也就是說(shuō)就算我們?cè)诔绦蛑猩婕皾h字，我們的排序也不回出錯(cuò)。
參考以下程序：

復(fù)制代碼 代碼如下:

var testArray = ["腳","本","之","家"];
         document.write(testArray.sort(
             function compareFunction(param1,param2){
                 return param1.localeCompare(param2);  //output:之,家,本,腳
             }
         ));

您可能感興趣的文章:

• js實(shí)現(xiàn)漢字排序的方法
• JavaScript 給漢字排序?qū)嵗a
• js漢字排序問(wèn)題 支持中英文混排，兼容各瀏覽器，包括CHROME
• jquery tablesorter.js 支持中文表格排序改進(jìn)
• 基于JS實(shí)現(xiàn)數(shù)字+字母+中文的混合排序方法
• Extjs Gird 支持中文拼音排序?qū)崿F(xiàn)代碼
• javascript對(duì)中文按照拼音排序代碼
• tablesorter.js表格排序使用方法(支持中文排序)
• 利用JavaScript對(duì)中文（漢字）進(jìn)行排序?qū)嵗斀?/a>

• JS
• sort
• localeCompare
• 中文排序

相關(guān)文章

• 

  javaScript 刪除字符串空格多種方法小結(jié)

  在js中自一些字符串刪除空格的功能，本文章來(lái)介紹了字符串刪除功能加利用正則快速替換字符串中所有空格實(shí)現(xiàn)代碼

  2012-10-10
• 

  菜鳥(niǎo)也能搞懂js中typeof與instanceof區(qū)別

  instanceof和typeof是兩個(gè)運(yùn)算符，在程序設(shè)計(jì)中用到，常用來(lái)判斷一個(gè)變量是否為空，或者是什么類型的，本文就來(lái)介紹一下typeof與instanceof區(qū)別，感興趣的可以了解一下

  2021-09-09
• 

  js使用for循環(huán)及if語(yǔ)句判斷多個(gè)一樣的name

  這篇文章主要介紹了js使用for循環(huán)機(jī)if語(yǔ)句判斷多個(gè)一樣的name,此法比較實(shí)用，需要的朋友可以參考下

  2014-09-09
• 

  全面解析Bootstrap中scrollspy（滾動(dòng)監(jiān)聽(tīng)）的使用方法

  這篇文章主要為大家全面解析Bootstrap中scrollspy（滾動(dòng)偵聽(tīng)）的使用方法，感興趣的小伙伴們可以參考一下

  2016-06-06
• 

  js實(shí)現(xiàn)頁(yè)面導(dǎo)航層級(jí)指示效果

  這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)頁(yè)面導(dǎo)航層級(jí)指示效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

  2020-08-08
• 

  javascript解析json數(shù)據(jù)的3種方式

  這篇文章主要介紹了解析json數(shù)據(jù)的3種方式,需要的朋友可以參考下

  2014-05-05
• 

  微信小程序云開(kāi)發(fā)之?dāng)?shù)據(jù)庫(kù)操作

  這篇文章主要為大家詳細(xì)介紹了微信小程序云開(kāi)發(fā)之?dāng)?shù)據(jù)庫(kù)操作，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

  2019-05-05
• 

  純JS打造網(wǎng)頁(yè)中checkbox和radio的美化效果

  這篇文章主要介紹了純JS打造網(wǎng)頁(yè)中checkbox和radio的美化效果,代碼簡(jiǎn)單易懂，非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下

  2016-10-10
• 

  bootstrap表單示例代碼分享

  這篇文章主要為大家詳細(xì)介紹了bootstrap表單示例代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

  2017-05-05
• 

  js輪播圖的插件化封裝詳解

  這篇文章主要為大家詳細(xì)介紹了js輪播圖的插件化封裝，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

  2017-07-07

最新評(píng)論