JS中多层次排序算法的实现代码


Posted in Javascript onJanuary 06, 2021

引子

排序在编程中随处可见,从开始学习变成,到项目开发,基本上或多或少会遇到一些排序问题,接下来我要写的是我在实际开发终于到的一个排序问题,一开始卡了我很久,后面随着知识积累,实践变多才解决掉了,不知道是不是我搜索关键字不对,还是其他原因,百度也没有找到这方面的内容。

数据结构和需求

var arr = [ {
"soNumber" : "52085848",
"item" : "313281",
"amount" : "3"
}, {
"soNumber" : "52085846",
"item" : "313321",
"amount" : "10"
}, {
"soNumber" : "52085848",
"item" : "313330",
"amount" : "5"
}, {
"soNumber" : "52085846",
"item" : "313321",
"amount" : "4"
}, {
"soNumber" : "52085843",
"item" : "313338",
"amount" : "13"
}, {
"soNumber" : "52085843",
"item" : "422784",
"amount" : "108"
} ]

数据结构如上,数组结构,每个数组元素由对象构成,soNumber代表采购订单编号,item代表物料,现需求是soNumber(采购订单编号)从小到大排序,且基于相同的采购订单下的物料数据编号需要从小到大排列。

两层排序实现代码

解决思路:

先将soNumber按从小到大的顺序整理成数组,然后以销售订单数组为外层循环,实际数据为内层循环,引入一个中间数组,中间数组中的item从小到大排序,最后按顺序将所有的中间数组元素放入新数组中。

实现代码:

/**
   * 两层排序算法
   */
  function multilayerSorting() {
   var arr = [ {
    "soNumber" : "52085848",
    "item" : "313281",
    "amount" : "3"
   }, {
    "soNumber" : "52085846",
    "item" : "313321",
    "amount" : "10"
   }, {
    "soNumber" : "52085848",
    "item" : "313330",
    "amount" : "5"
   }, {
    "soNumber" : "52085846",
    "item" : "313321",
    "amount" : "4"
   }, {
    "soNumber" : "52085843",
    "item" : "313338",
    "amount" : "13"
   }, {
    "soNumber" : "52085843",
    "item" : "422784",
    "amount" : "108"
   } ]
   // 整理soNumber成数组,并且从小到大排列
   var soData = getSoData(arr);
   var newData = [];
   for ( var i in soData) {
    var midData = []
    for ( var j in arr) {
     if (soData[i] == arr[j].soNumber) {
      midData.push(arr[j]);
     }
    }
    midData = midData.sort(function(obj1, obj2) {
     var val1 = Number(obj1.item);
     var val2 = Number(obj2.item);
     if (val1 < val2) {
      return -1;
     } else if (val1 > val2) {
      return 1;
     } else {
      return 0;
     }
    });
    log.debug('midData', midData);
    for ( var m in midData) {
     newData.push(midData[m]);
    }
   }
   log.debug('newData', newData);
   return newData;
  }
  function getSoData(arr) {
   var soData = [];
   for ( var i in arr) {
    if (soData.indexOf(arr[i].soNumber) == -1) {
     soData.push(arr[i].soNumber);
    }
   }
   soData.sort();
   log.debug('soData', soData);
   return soData;
  }<br>

最终数组截图:

JS中多层次排序算法的实现代码 

对比一开始的数组和排序后的数组确实实现了按照soNumber和item两个部分顺序排列,但是也可以看到圈出来的部分的amount金额在相同的soNumber和item下并没有顺序,如果要实现amount部也有序呢?

三层排序

实现代码:

/**
    * 三层排序算法
    */
   function multilayerSorting() {
    var arr = [ {
     "soNumber" : "52085848",
     "item" : "313281",
     "amount" : "3"
    }, {
     "soNumber" : "52085846",
     "item" : "313321",
     "amount" : "10"
    }, {
     "soNumber" : "52085848",
     "item" : "313330",
     "amount" : "5"
    }, {
     "soNumber" : "52085846",
     "item" : "313321",
     "amount" : "4"
    }, {
     "soNumber" : "52085843",
     "item" : "313338",
     "amount" : "13"
    }, {
     "soNumber" : "52085843",
     "item" : "422784",
     "amount" : "108"
    } ]
    // 整理soNumber成数组,并且从小到大排列
    var soData = getSoData(arr);
    var newData = [];
    for ( var i in soData) {
     var midData = []
     for ( var j in arr) {
      if (soData[i] == arr[j].soNumber) {
       midData.push(arr[j]);
      }
     }
     midData = midData.sort(function(obj1, obj2) {
      var val1 = Number(obj1.item);
      var val2 = Number(obj2.item);
      if (val1 < val2) {
       return -1;
      } else if (val1 > val2) {
       return 1;
      } else {
       return 0;
      }
     });
     var itemData = []
     for ( var m in midData) {
      if (itemData.indexOf(midData[m].item) == -1) {
       itemData.push(midData[m].item)
      }
     }
     for ( var n in itemData) {
      var midData1 = [];
      for ( var x in midData) {
       if (midData[x].item == itemData[n]) {
        midData1.push(midData[x]);
       }
      }
      midData1 = midData1.sort(function(obj1, obj2) {
       var val1 = Number(obj1.amount);
       var val2 = Number(obj2.amount);
       if (val1 < val2) {
        return -1;
       } else if (val1 > val2) {
        return 1;
       } else {
        return 0;
       }
      });
      for ( var y in midData1) {
       newData.push(midData1[y]);
      }
     }
    }
    log.debug('newData', newData);
    return newData;
   }
   function getSoData(arr) {
    var soData = [];
    for ( var i in arr) {
     if (soData.indexOf(arr[i].soNumber) == -1) {
      soData.push(arr[i].soNumber);
     }
    }
    soData.sort();
    log.debug('soData', soData);
    return soData;
   }

实现结果 

JS中多层次排序算法的实现代码 

从结果可以看出实现了依次按照soNumber ,item ,amount 从小到大排列

思考

从两层排序到三层排序我们可以发现代码原来越繁琐,如果要实现四层就更加麻烦了,不知道是否有更好的办法实现这种多维度,多层次的排序。

var arr = [ {
"soNumber" : "52085848",
"item" : "313281",
"amount" : "3"
}, {
"soNumber" : "52085846",
"item" : "313321",
"amount" : "10"
}, {
"soNumber" : "52085848",
"item" : "313330",
"amount" : "5"
}, {
"soNumber" : "52085846",
"item" : "313321",
"amount" : "4"
}, {
"soNumber" : "52085843",
"item" : "313338",
"amount" : "13"
}, {
"soNumber" : "52085843",
"item" : "422784",
"amount" : "108"
} ]

总结

到此这篇关于JS中多层次排序算法的文章就介绍到这了,更多相关JS多层次排序算法内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
js特效,页面下雪的小例子
Jun 17 Javascript
javascript数字时钟示例分享
Apr 23 Javascript
JavaScript Promise启示录
Aug 12 Javascript
Jquery日期选择datepicker插件用法实例分析
Jun 08 Javascript
深入理解JQuery中的事件与动画
May 18 Javascript
Bootstrap面板学习使用
Feb 09 Javascript
详解vue项目优化之按需加载组件-使用webpack require.ensure
Jun 13 Javascript
js异步编程小技巧详解
Aug 14 Javascript
Angular使用操作事件指令ng-click传多个参数示例
Mar 27 Javascript
Express本地测试HTTPS的示例代码
Jun 06 Javascript
Vue中的Props(不可变状态)
Sep 29 Javascript
Vue实现圆环进度条的示例
Feb 06 Vue.js
如何使用原生Js实现随机点名详解
Jan 06 #Javascript
详解微信小程序「渲染层网络层错误」的解决方法
Jan 06 #Javascript
JavaScript 中的六种循环方法
Jan 06 #Javascript
JavaScript的一些小技巧分享
Jan 06 #Javascript
详解Vue2的diff算法
Jan 06 #Vue.js
如何利用JavaScript编写一个格斗小游戏
Jan 06 #Javascript
vuex的使用步骤
Jan 06 #Vue.js
You might like
php mysql Errcode: 28 终极解决方法
2009/07/01 PHP
用PHP读取超大文件的实例代码
2012/04/01 PHP
PHP关于htmlspecialchars、strip_tags、addslashes的解释
2014/07/04 PHP
PHP生成指定长度随机数最简洁的方法
2014/07/14 PHP
PHP获取youku视频真实flv文件地址的方法
2014/12/23 PHP
php使用curl详细解析及问题汇总
2016/08/11 PHP
php 从指定数字中获取随机组合的简单方法(推荐)
2017/04/05 PHP
(function($){...})(jQuery)的意思
2010/07/22 Javascript
javascript中直接写php代码的方法
2013/07/31 Javascript
老生常谈 js中this的指向
2016/06/30 Javascript
Bootstrap Metronic完全响应式管理模板学习笔记
2016/07/08 Javascript
利用python分析access日志的方法
2016/10/26 Javascript
bootstrap table配置参数例子
2017/01/05 Javascript
bootstrap3-dialog-master模态框使用详解
2017/08/22 Javascript
requireJS模块化实现返回顶部功能的方法详解
2017/10/16 Javascript
手机注册发送验证码倒计时的简单实例
2017/11/15 Javascript
vue.js使用v-pre与v-html输出HTML操作示例
2018/07/07 Javascript
JS实现水平移动与垂直移动动画
2019/12/19 Javascript
[02:09]DOTA2辉夜杯 EHOME夺冠举杯现场
2015/12/28 DOTA
Python的类实例属性访问规则探讨
2015/01/30 Python
Python3中使用urllib的方法详解(header,代理,超时,认证,异常处理)
2016/09/21 Python
酷! 程序员用Python带你玩转冲顶大会
2018/01/17 Python
Python实现将数据框数据写入mongodb及mysql数据库的方法
2018/04/02 Python
使用python验证代理ip是否可用的实现方法
2018/07/25 Python
pandas重新生成索引的方法
2018/11/06 Python
python 函数中的内置函数及用法详解
2019/07/02 Python
Python初学者常见错误详解
2019/07/02 Python
python 并发编程 非阻塞IO模型原理解析
2019/08/20 Python
win10系统下python3安装及pip换源和使用教程
2020/01/06 Python
python logging模块的使用
2020/09/07 Python
css3让div随鼠标移动而抖动起来
2014/02/10 HTML / CSS
CSS3 函数技巧 用css 实现js实现的事情(clac Counters Tooltip)
2017/08/15 HTML / CSS
台湾深度自由行旅游平台:Tripbaa趣吧
2017/10/10 全球购物
2014年元旦联欢会活动策划方案
2014/02/16 职场文书
药品开票员岗位职责
2015/04/15 职场文书
mysql连接查询中and与where的区别浅析
2021/07/01 MySQL