JS中json數組多字段排序方法（解決兼容性問題）(轉)

    前端對一個json數組進行排序，用戶需要動態的根據自己的選擇來對json數據進行排序。

     由於后台表設計問題所以不能用sql進行排序，這里用到了js的sort方法。

如果對單字段排序，那么很簡單，一個sort就搞定。對多字段排序時需要用到for，而且需要對在sort中對任意兩個元素進行比較，如果前一個字段相同那么才需要進行下一個字段的排序；反之則返回 0。秉承此思路編寫代碼如下：

var orderArr = sortObjectArray(dataObj,['path_cate','path_ver','path_id'],"asc");
function sortObjectArray(objArr, keyArr, type) {
      if (type != undefined && type != 'asc' && type != 'desc') {
          return 'error';
      }
      var order = 1;
      if (type != undefined && type == 'desc') {
          order = -1;
      }
      var key = keyArr[0];
      objArr.sort(function (objA, objB) {
          if (objA[key] > objB[key]) {
              return order;
          } else if (objA[key] < objB[key]) {
              return 0 - order;
          } else {
              return 0;
          }
      })
      for (var i = 1; i < keyArr.length; i++) {
          var key = keyArr[i];
          objArr.sort(function (objA, objB) {
              for (var j = 0; j < i; j++) {
                  if (objA[keyArr[j]] != objB[keyArr[j]]) {
                      return 0;
                  }
              }
              if (objA[key] > objB[key]) {
                  return order;
              } else if (objA[key] < objB[key]){
                  return 0 - order;
              } else {
                  return 0;
              }
          })
      }
      return objArr;
  }

  在進行代碼測試的時候遇到了一個問題，發現每次執行任務，json數組的順序都會有變化。檢查幾遍自認為代碼沒有問題，百度時突然想到chrome的sort方法會有一個“bug”，那就是如果元素相同，那么排序會亂掉而不是保持原有順序。用上面代碼在firefox中測試果然沒有問題。

知道問題所在就想如何解決此問題，網上的各路大神都提供了自己的想法，受到啟發，如果是元素相同那么只要保持原排序即可。所以就有了如下改良代碼：

function sortObjectArray(objArr, keyArr, type) {
       for (var x = 0; x < objArr.length; x++) {
           objArr[x].oldIndex = x;
       }
      if (type != undefined && type != 'asc' && type != 'desc') {
          return 'error';
      }
      var order = 1;
      if (type != undefined && type == 'desc') {
          order = -1;
      }
      var key = keyArr[0];
      objArr.sort(function (objA, objB) {
          if (objA[key] > objB[key]) {
              return order;
          } else if (objA[key] < objB[key]) {
              return 0 - order;
          } else {
              if (objA.oldIndex > objB.oldIndex) {
                  return order;
              } else if (objA.oldIndex < objB.oldIndex) {
                  return 0 - order;
              } else {
                      
                  return 0;
              }
          }
      })
      
      for (var i = 1; i < keyArr.length; i++) {
          var key = keyArr[i];
          for (var y= 0; y < objArr.length; y++) {
              objArr[y].oldIndex = y;
              }
          objArr.sort(function (objA, objB) {
              for (var j = 0; j < i; j++) {
                  if (objA[keyArr[j]] != objB[keyArr[j]]) {
                       if (objA.oldIndex > objB.oldIndex) {
                           return order;
                       } else if (objA.oldIndex < objB.oldIndex){
                           return 0 - order;
                       } else {
                           return 0;
                       }
                  }
              }
              if (objA[key] > objB[key]) {
                  return order;
              } else if (objA[key] < objB[key]){
                  return 0 - order;
              } else {
                   if (objA.oldIndex > objB.oldIndex) {
                       return order;
                   } else if (objA.oldIndex < objB.oldIndex){
                       return 0 - order;
                   } else {
                       return 0;
                   }
              }
          })
      }
      return objArr;
  }

經過測試，此代碼在chrome和firefox中都可正確執行。

至此，問題解決，在此記錄分享。

 

轉自 https://blog.csdn.net/windon12345/article/details/81075492