JavaScript字符串排序localeCompare()笔记

转摘：http://www.cnblogs.com/anniey/p/6184301.html

今天遇到了一个没有接触过的方法，是localeCompare()。查了一些相关的文档，给出的定义很模糊，所以就把自己的理解写下来。

　　首先由例子入手！

　　已知一串学生姓名的字符串，根据学生姓名的长度按照降序排序，并返回名称列表。等长度的名称将以相反的字母顺序（Z-> A）返回。

　　给出字符串 string = "xxa xxb xxc xxd xa xb xc xd";

　　返回 ['xxd', 'xxc', 'xxb', 'xxa', 'xd', 'xc', 'xb', 'xa'];

接下来就是正解代码！

复制代码
 1 function lineupStudents(students){
 2     var stu=students.split(" ");
 3     stu.sort(function(a,b){
 4         if(a.length==b.length){
 5             return b.localeCompare(a);
 6         }else{
 7             return b.length-a.length;
 8         }
 9     });
10     console.log(stu);
11 }
12 var s1 = 'Tadashi Takahiro Takao Takashi Takayuki Takehiko Takeo Takeshi Takeshi';
13 lineupStudents(s1);//输出['Takehiko','Takayuki','Takahiro','Takeshi','Takeshi','Takashi','Tadashi','Takeo','Takao']
复制代码

　　这个例子中还是利用array对象的排序方法，在排序参数提供的函数中再来进行本地的排序。

　　接下来看看Sort() 官方说法：

 

arrayobj.sort(sortfunction)

 

　　参数

 

arrayObj

 

必选项。任意 Array 对象。

 

sortFunction

 

可选项。是用来确定元素顺序的函数的名称。如果这个参数被省略，那么元素将按照 ASCII 字符顺序进行升序排列。

 

　　说明

 

sort 方法将 Array 对象进行适当的排序；在执行过程中并不会创建新的 Array 对象。

 

如果为 sortfunction 参数提供了一个函数，那么该函数必须返回下列值之一：

 

  • 负值，如果所传递的第一个参数比第二个参数小。
  • 零，如果两个参数相等。
  • 正值，如果第一个参数比第二个参数大。

 

再来看看localeCompare()是怎么说的！

 

　　定义和用法

 

用本地特定的顺序来比较两个字符串。

 

　　语法

 

stringObject.localeCompare(target)

 

参数

描述

target

要以本地特定的顺序与 stringObject 进行比较的字符串。

 

返回值

 

说明比较结果的数字。如果 stringObject 小于 target，则 localeCompare() 返回小于 0 的数。如果 stringObject 大于 target，则该方法返回大于 0 的数。如果两个字符串相等，或根据本地排序规则没有区别，该方法返回 0。

 

综上两个方法的说明，在sortfunction参数存在的情况下都会有数字结果返回值。而在例子中最关键的步骤就是b.localeCompare(a)，按着特定的顺序比较两个字符串；

 

另外再补充一点，stringObj.localeCompare(target)中谁比较谁，决定了列表的升序还是降序。例如：

 

1 if(a.length==b.length){
2     return a.localeCompare(b);
3 }else{
4     return a.length-b.length;
5 }

 

结果显示就是升序排列！

针对于localeCompare()（比较两个字符串，考虑了默认的本地排序规则），使用的本地规则有汉字和英语的，例子中用的是英语，则是根据字母排序的。如果有用到汉字则是根据汉字拼音来排序。

 

 

js数组的sort排序详解

 

 

废话少说直接上代码：

复制代码
<body>
    <div>
    sort()对数组排序，不开辟新的内存，对原有数组元素进行调换
    </div>
    <div id="showBox">
    1、简单数组简单排序
    <script type="text/javascript">
        var arrSimple=new Array(1,8,7,6);
        arrSimple.sort();
        document.writeln(arrSimple.join());
    </script>
    </div>
    <div>
    2、简单数组自定义排序
    <script type="text/javascript">
        var arrSimple2=new Array(1,8,7,6);
        arrSimple2.sort(function(a,b){
            return b-a});
        document.writeln(arrSimple2.join());
    </script>
    解释：a,b表示数组中的任意两个元素，若return > 0 b前a后；reutrn < 0 a前b后；a=b时存在浏览器兼容
    简化一下：a-b输出从小到大排序，b-a输出从大到小排序。
    </div>
    <div>
    3、简单对象List自定义属性排序
    <script type="text/javascript">
        var objectList = new Array();
        function Persion(name,age){
            this.name=name;
            this.age=age;
            }
        objectList.push(new Persion('jack',20));
        objectList.push(new Persion('tony',25));
        objectList.push(new Persion('stone',26));
        objectList.push(new Persion('mandy',23));
        //按年龄从小到大排序
        objectList.sort(function(a,b){
            return a.age-b.age});
        for(var i=0;i<objectList.length;i++){
            document.writeln('<br />age:'+objectList[i].age+' name:'+objectList[i].name);
            }
    </script>
    </div>
    <div>
    4、简单对象List对可编辑属性的排序
    <script type="text/javascript">
        var objectList2 = new Array();
        function WorkMate(name,age){
            this.name=name;
            var _age=age;
            this.age=function(){
                if(!arguments)
                {
                    _age=arguments[0];}
                else
                {
                    return _age;}
                }
                
            }
        objectList2.push(new WorkMate('jack',20));
        objectList2.push(new WorkMate('tony',25));
        objectList2.push(new WorkMate('stone',26));
        objectList2.push(new WorkMate('mandy',23));
        //按年龄从小到大排序
        objectList2.sort(function(a,b){
            return a.age()-b.age();
            });
        for(var i=0;i<objectList2.length;i++){
            document.writeln('<br />age:'+objectList2[i].age()+' name:'+objectList2[i].name);
            }
    </script>
    </div>
</body>

 

 

posted @ 2017-09-04 12:02  冲向蓝天  阅读(1116)  评论(0)    收藏  举报