js中json對象數組按對象屬性排序（sort方法）---2（根據拼音排序漢字和排序英文）

本例主要實現 中文漢字按拼音排序的方法和英文按照首字母排序的方法。

 

要排序的數據：

//要排序的數據
let data = [
        {chinese: '蔡司', english: 'Chase'},
        {chinese: '艾倫', english: 'Allen'},    
        {chinese: '左拉', english: 'Zola'},
        {chinese: '貝克', english: 'Baker'},    
        {chinese: '伯格', english: 'Berg'},    
        {chinese: '菲奇', english: 'Fitch'},    
        {chinese: '迪安', english: 'Dean'},    
        {chinese: '厄爾', english: 'Earle'},        
        {chinese: '亨利', english: 'Henry'},
        
    ]

根據漢字拼音排序

這里要用到一個字符串方法：

localeCompare() 方法

定義和用法

用本地特定的順序來比較兩個字符串。

語法

stringObject.localeCompare(target)

參數	描述
target	要以本地特定的順序與 stringObject 進行比較的字符串。

返回值

說明比較結果的數字。如果 stringObject 小於 target，則 localeCompare() 返回小於 0 的數。如果 stringObject 大於 target，則該方法返回大於 0 的數。如果兩個字符串相等，或根據本地排序規則沒有區別，該方法返回 0。

說明

把 < 和 > 運算符應用到字符串時，它們只用字符的 Unicode 編碼比較字符串，而不考慮當地的排序規則。以這種方法生成的順序不一定是正確的。例如，在西班牙語中，其中字符 “ch” 通常作為出現在字母 “c” 和 “d” 之間的字符來排序。

localeCompare() 方法提供的比較字符串的方法，考慮了默認的本地排序規則。ECMAscript 標准並沒有規定如何進行本地特定的比較操作，它只規定該函數采用底層操作系統提供的排序規則。

 

可是排序：

 

從z~a

    //根據漢字首字母排序
    //使用箭頭函數
    //【注】localeCompare() 是js內置方法
     data.sort((a, b)=> b.chinese.localeCompare(a.chinese, 'zh')); //z~a 排序

從a~z

     data.sort((a, b)=> a.chinese.localeCompare(b.chinese, 'zh')); //a~z 排序    

根據英文首字母的ASCLL碼進行排序

從z~a

    //根據英文排序 比較 首字母ASCLL碼
    //使用箭頭函數
    data.sort((a, b) => b.english.charCodeAt(0) - a.english.charCodeAt(0)); //z~a 排序

 

從a~z

    data.sort((a, b) => a.english.charCodeAt(0) - b.english.charCodeAt(0)); //a~z 排序    

 

完整演示代碼：

//要排序的數據
let data = [
        {chinese: '蔡司', english: 'Chase'},
        {chinese: '艾倫', english: 'Allen'},    
        {chinese: '左拉', english: 'Zola'},
        {chinese: '貝克', english: 'Baker'},    
        {chinese: '伯格', english: 'Berg'},    
        {chinese: '菲奇', english: 'Fitch'},    
        {chinese: '迪安', english: 'Dean'},    
        {chinese: '厄爾', english: 'Earle'},        
        {chinese: '亨利', english: 'Henry'},
        
    ]

    //根據漢字首字母排序
    //使用箭頭函數
    //【注】localeCompare() 是js內置方法
    // data.sort((a, b)=> b.chinese.localeCompare(a.chinese, 'zh')); //z~a 排序
    // data.sort((a, b)=> a.chinese.localeCompare(b.chinese, 'zh')); //a~z 排序    
    // console.log(data);

    //根據英文排序 比較 首字母ASCLL碼
    //// console.log(data[0].english.charCodeAt(0));
    // data.sort((a, b) => b.english.charCodeAt(0) - a.english.charCodeAt(0)); //z~a 排序
    data.sort((a, b) => a.english.charCodeAt(0) - b.english.charCodeAt(0)); //a~z 排序    

    console.log(data);

控制台輸出效果（英文從a~z的效果）：