js數組的sort排序詳解

時間 2019-11-11

原文原文鏈接

代碼：javascript

<body>
    <div>
    sort()對數組排序，不開闢新的內存，對原有數組元素進行調換
    </div>
    <div id="showBox">
    一、簡單數組簡單排序
    <script type="text/javascript">
        var arrSimple=new Array(1,8,7,6);
        arrSimple.sort();
        document.writeln(arrSimple.join());
    </script>
    </div>
    <div>
    二、簡單數組自定義排序
    <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>
    三、簡單對象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>
    四、簡單對象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>
    5.動態的根據數據排序
    var data = [{name:'tom',age:'28'},{name:'cat',age:'29'}];
    function createCompact(field){
        return function(object1,object2){
             var value1 = object1[field];
             var value2 = object2[field];
             if(value1 < value2){
                  return -1;
             }else if(value1 > value2){
                  return 1;
             }else{
                  return 0;
             }
        }
    };
    data.sort(createCompact('name'));
    6.對Object數組排序的其餘寫法:
    //定義一個比較器 
    function keysrt(key,desc) {
	      return function(a,b){
		     return desc ? ~~(a[key] < b[key]) : ~~(a[key] > b[key]);
	      }
    }
	//應用場景:
    var ary=[{id:1,name:"b"},{id:2,name:"b"}];
    ary.sort(keysrt('name',true));
    ary.sort(keysrt('name',false));
    ary.sort(keysrt('id',false));
    </div>
</body>

知識點：java

1,sort(function(a,b){return a-b;})對傳入的一對值進行比較，而後返回的的值爲：小於0，大於0，等於0；（大於0交換位置，反之則不）數組

* 當小於0時，說明b>a，故b的排序靠後（即不變,覺得默認按升序排序）.瀏覽器

* 當大於0時，說明a>b，故a的排序靠後(由於默認按照升序排序,若是a>b,因此a要排在b的後面).this

* 當等於0時，說明a=b，故不改變排序.code

若是對數值數組的值進行降序排序。那麼只要把返回的值改成b-a!對象