前端 - JavaScript如何实现汉字按拼音首字母分组拼序

Question

最近需要做一个类似于微信好友列表的界面，后端只返回简单的查询结果，如何在后端不提供汉字按拼音首字母排序结果的情况下，前端自行将汉字按拼音首字母排序，有什么好的开源类库，还是有什么好的汉字与字母的映射表或编码表可用。

Answer 1

楼主这个问题很不错，中文拼音排序一直都是很有趣的一个问题。推荐使用这个函数 String.prototype.localeCompare()，链接 MDN。

给题主分享一下我之前弄过的(代码不是我原创，也是模仿别人写的)，首先用 localeCompare 试下拼音排序：

var array = ['武汉', '北京', '上海', '天津'];
array.sort(
    function compareFunction(param1, param2) {
        return param1.localeCompare(param2);
    }
);
array // ["北京", "上海", "天津", "武汉"]

然后根据 26 个英文字母分组排序，函数如下，

function pySegSort(arr) {
    if(!String.prototype.localeCompare)
        return null;
     
    var letters = "*abcdefghjklmnopqrstwxyz".split('');
    var zh = "阿八嚓哒妸发旮哈讥咔垃痳拏噢妑七呥扨它穵夕丫帀".split('');
     
    var segs = [];
    var curr;
    letters.forEach(function(item,i){
        curr = {letter: item, data:[]};
        arr.forEach(function(item2){
            if((!zh[i-1] || zh[i-1].localeCompare(item2) <= 0) && item2.localeCompare(zh[i]) == -1) {
                curr.data.push(item2);
            }
        });
        if(curr.data.length) {
            segs.push(curr);
            curr.data.sort(function(a,b){
                return a.localeCompare(b);
            });
        }
    });
    return segs;
}

测试：

pySegSort(["我","不","懂","爱","啊","按","已","呀","选","县"])

结果：

[{"letter":"a","data":["啊","爱","按"]},{"letter":"b","data":["不"]},{"letter":"d","data":["懂"]},{"letter":"w","data":["我"]},{"letter":"x","data":["县","选"]},{"letter":"y","data":["呀","已"]}]

这个函数还有很多坑要爬，比如中英文混搭排序等，祝题主好运。

Answer 2

https://github.com/hotoo/pinyin