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 相关文章推荐
用JavaScript显示随机图像或引用
Apr 21 Javascript
用js实现的模拟jquery的animate自定义动画(2.5K)
Jul 20 Javascript
js下通过getList函数实现分页效果的代码
Sep 17 Javascript
jquery实现的可隐藏重现的靠边悬浮层实例代码
May 27 Javascript
DOM基础教程之使用DOM控制表格
Jan 20 Javascript
JavaScript Math 对象常用方法总结
Apr 28 Javascript
JavaScript中Number对象的toFixed() 方法详解
Sep 02 Javascript
Jquery中attr与prop的区别详解
May 27 jQuery
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
Jun 10 Javascript
JS合并两个数组的3种方法详解
Oct 24 Javascript
纯js+css实现仿移动端淘宝网站的弹出详情框功能
Dec 29 Javascript
在Angular中实现一个级联效果的下拉框的示例代码
May 20 Javascript
如何使用原生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+js iframe实现上传头像界面无跳转
2014/04/29 PHP
PHP版QQ互联OAuth示例代码分享
2015/07/05 PHP
vue.js声明式渲染和条件与循环基础知识
2017/07/31 Javascript
React-Native使用Mobx实现购物车功能
2017/09/14 Javascript
jQuery实现对网页节点的增删改查功能示例
2017/09/18 jQuery
基于Vue制作组织架构树组件
2017/12/06 Javascript
javascript数组拍平方法总结
2018/01/20 Javascript
Vue中UI组件库之Vuex与虚拟服务器初识
2019/05/07 Javascript
angularjs自定义过滤器demo示例
2019/08/24 Javascript
javascript设计模式 ? 单例模式原理与应用实例分析
2020/04/09 Javascript
解决Echarts 显示隐藏后宽度高度变小的问题
2020/07/19 Javascript
浅析微信小程序自定义日历组件及flex布局最后一行对齐问题
2020/10/29 Javascript
python学习数据结构实例代码
2015/05/11 Python
Python实现定时任务
2017/02/08 Python
解决Python安装后pip不能用的问题
2018/06/12 Python
Python中的CSV文件使用&quot;with&quot;语句的方式详解
2018/10/16 Python
Python生成rsa密钥对操作示例
2019/04/26 Python
Python处理时间日期坐标轴过程详解
2019/06/25 Python
PYTHON绘制雷达图代码实例
2019/10/15 Python
python运用sklearn实现KNN分类算法
2019/10/16 Python
如何在python中写hive脚本
2019/11/08 Python
浅谈python 中的 type(), dtype(), astype()的区别
2020/04/09 Python
Python限制内存和CPU使用量的方法(Unix系统适用)
2020/08/04 Python
零基础学python应该从哪里入手
2020/08/11 Python
整理HTML5中支持的URL编码与字符编码
2016/02/23 HTML / CSS
使用Html5实现异步上传文件,支持跨域,带有上传进度条
2016/09/17 HTML / CSS
荷兰睡眠专家:Beter Bed
2020/11/23 全球购物
买房子个人收入证明
2014/01/16 职场文书
我的中国梦演讲稿400字
2014/08/19 职场文书
5.12护士节活动总结
2015/02/10 职场文书
2015年学校远程教育工作总结
2015/07/20 职场文书
中国古代史学名著《战国策》概述
2019/08/09 职场文书
深入理解go slice结构
2021/09/15 Golang
阿里云日志过滤器配置日志服务
2022/04/09 Servers
Docker官方工具docker-registry案例演示
2022/04/13 Servers
基于Redission的分布式锁实战
2022/08/14 Redis