经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置：技术经验 » JSJS库框架 » JavaScript » 查看文章
利用扩展符排序合并数组，记录下来分享给大家
来源：cnblogs　　作者：文博的博客　　时间：2018/9/26 17:54:30　　对本文有异议

最近接到了新的需求，消息中心按照未读已读时间排序的问题，由于前后端分离项目，后端在远隔千里的那边，而且也是不同的分公司，让后台改接口是不可能啦~。后端给的比较混杂如下：

  1. {
  2.     "mapResult": [{
  3.         "ID": 3749,
  4.         "TITLE": "待处理：柏欢测试计划--目标设定",
  5.         "CREATE_DATE": "2018-06-23 14:30:50",
  6.         "PUBLISH_DATE": "2018-06-23 14:30:50",
  7.         "HAS_READ": 3749,
  8.         "flag": "2018-06-23"
  9.     }, {
  10.         "ID": 3740,
  11.         "TITLE": "待处理：柏欢测试计划--目标设定",
  12.         "CREATE_DATE": "2018-06-22 22:29:46",
  13.         "PUBLISH_DATE": "2018-06-22 22:29:46",
  14.         "HAS_READ": 3740,
  15.         "flag": "2018-06-22"
  16.     }, {
  17.         "ID": 3721,
  18.         "TITLE": "待处理：柏欢测试计划--目标设定",
  19.         "CREATE_DATE": "2018-06-22 21:06:21",
  20.         "PUBLISH_DATE": "2018-06-22 21:06:21",
  21.         "HAS_READ": 3721,
  22.         "flag": "2018-06-22"
  23.     }, {
  24.         "ID": 3707,
  25.         "TITLE": "待处理：柏欢测试计划--目标设定",
  26.         "CREATE_DATE": "2018-06-23 22:43:41",
  27.         "PUBLISH_DATE": "2018-06-23 22:43:41",
  28.         "HAS_READ": 0,
  29.         "flag": "2018-06-22"
  30.     },{
  31.         "ID": 3705,
  32.         "TITLE": "待处理：柏欢测试计划--目标设定",
  33.         "CREATE_DATE": "2018-06-22 20:43:41",
  34.         "PUBLISH_DATE": "2018-06-22 20:43:41",
  35.         "HAS_READ": 0,
  36.         "flag": "2018-06-22"
  37.     } ,{
  38.         "ID": 261,
  39.         "TITLE": "待处理：管信-erp-人力其它-月--员工自评",
  40.         "CREATE_DATE": "2018-05-03 14:04:59",
  41.         "PUBLISH_DATE": "2018-05-03 14:04:59",
  42.         "HAS_READ": 261,
  43.         "flag": "2018-05-03"
  44.     }, {
  45.         "ID": 3706,
  46.         "TITLE": "待处理：柏欢测试计划--目标设定",
  47.         "CREATE_DATE": "2018-06-25 21:43:41",
  48.         "PUBLISH_DATE": "2018-06-25 21:43:41",
  49.         "HAS_READ": 0,
  50.         "flag": "2018-06-22"
  51.     },{
  52.         "ID": 265,
  53.         "TITLE": "待处理：管信-erp-人力其它-月--员工自评",
  54.         "CREATE_DATE": "2018-05-03 15:04:59",
  55.         "PUBLISH_DATE": "2018-05-03 15:04:59",
  56.         "HAS_READ": 265,
  57.         "flag": "2018-05-03"
  58.     }]
  59. }

上述数据为后台给的数据：

  1. HAS_READ字段为：0是未读，为ID是已读。
    需求是按照先未读在已读，然后未读已读分别按照时间在排序，想到这大部分小伙伴都觉得可能需要2-3个循环才可以搞定！，但是我们也要考虑性能，所以思索了一会按照以下代码进行了排序
　　　　　　　　let self=this;
  1. 　　　　　　　let mapResultUnread=[];
  2.             let mapResultRead=[];
  3.             let mapResult=[];
  4.            for(var i=0;i<res.mapResult.length;i++){
  5.             if(res.mapResult[i].HAS_READ=='0'){
  6.                 mapResultUnread.push(res.mapResult[i]); //如果是未读 存进未读数组
  7.             }else{
  8.                 mapResultRead.push(res.mapResult[i]);  //反之存进已读数组
  9.             }
  10.             
  11.            }
  12.            mapResultUnread.sort(self.sortHAS_REA);  //按照时间排序
  13.            mapResultRead.sort(self.sortHAS_REA);//按照时间排序
  1.            mapResult=[...mapResultUnread,...mapResultRead]  //合并两个数组
  1.     sortHAS_READ(a,b){  //按照日期排序
  2.         return Date.parse(a.CREATE_DATE) - Date.parse(b.CREATE_DATE) 
  3.     }

 

1、先声明三个三个空数组，分别为未读已读，和排序好的列表，

2、循环如果是未读直接放到未读列表，不是未读就是已读了，那么久放在已读列表，

3、然后在分别按照日期排序，用sort方法。

4、最后运用展开符合并两个数组。

 

 

比较简单，随笔记录一下分享给大家

 友情链接：直通硅谷 　点职佳 　北美留学生论坛

JavaScript热门文章

  • echarts 饼图 + 全屏显示
  • js正则匹配以{开头,以}结尾的表达式怎么写？-附源码
  • echarts 实现数据(tooltip)自动轮播插件
  • Js设置博客园主题色(theme-color)
  • elementUI 设置input的只读或禁用的方法
  • 超级好用的流程图js框架 值得收藏
  • layui table+复杂表头+合并单元格
  • 获取地理位置
  • 如何使用JavaScript导入和导出Excel文件
  • WebStorm eslint插件报错解决 - TypeError: this.CliEngine is not a constructor

    • JavaScript推荐文章

  • 一些八股：1.fetch 的理解。2.let、const、var
  • 电子表格转身购物车：三步轻松实现
  • Canvas简历编辑器-图形绘制与状态管理(轻量级DOM)
  • IntersectionObserver + scrollIntoView 实现电梯导航 - xingba-coder
  • 可视化—gojs 超多超实用经验分享(三)
  • PixiJS源码分析系列： 第一章 从最简单的例子入手
  • WebRTC入门
  • 前端 Array.sort() 源码学习
  • 【技巧】JS代码这么写，前端小姐姐都会爱上你
  • 【JS】await异常捕获，这样做才完美

    • 本站QQ群：前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

    W3xue 的所有内容仅供测试，对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
    关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接（目前9元/月）请联系QQ：27243702 沸活量
    皖ICP备17017327号-2　皖公网安备34020702000426号