js对map排序,后端返回有序的LinkedHashMap类型时前端获取后顺序依旧从小到大的解决方法

js对map排序,后端返回有序的LinkedHashMap类型时前端获取后顺序依旧从小到大的解决方法

  • js对map排序,后端返回有序的LinkedHashMap类型时前端获取后顺序依旧从小到大的解决方法

  • [
        {
            "2020": [
                {
                    "id": 39,
                    "createTime": "2020-10-15T22:29:20.016",
                    "year": 2020,
                    "monthDay": "10-15",
                    "title": "冒泡排序"
                },
                {
                    "id": 37,
                    "createTime": "2020-10-14T11:44:12.163",
                    "year": 2020,
                    "monthDay": "10-14",
                    "title": "这是博客标题13"
                }
            ],
            "2019": [
                {
                    "id": 28,
                    "createTime": "2019-10-15T18:57:41.409",
                    "year": 2019,
                    "monthDay": "10-15",
                    "title": "这是博客标题5"
                },
                {
                    "id": 27,
                    "createTime": "2019-10-15T18:57:38.442",
                    "year": 2019,
                    "monthDay": "10-15",
                    "title": "这是博客标题4"
                },
                {
                    "id": 26,
                    "createTime": "2019-10-15T18:57:36.086",
                    "year": 2019,
                    "monthDay": "10-15",
                    "title": "这是博客标题3"
                }
            ],
            "2018": [
                {
                    "id": 25,
                    "createTime": "2018-10-15T18:57:31.986",
                    "year": 2018,
                    "monthDay": "10-15",
                    "title": "这是博客标题2"
                },
                {
                    "id": 24,
                    "createTime": "2018-10-15T18:57:27.428",
                    "year": 2018,
                    "monthDay": "10-15",
                    "title": "这是博客标题1"
                }
            ],
            "2017": [
                {
                    "id": 12,
                    "createTime": "2017-10-14T11:44:12.163",
                    "year": 2017,
                    "monthDay": "10-14",
                    "title": "### 博客"
                }
            ]
        }
    ]
    
  • 浏览器获取结果变成了:

  • [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0vkNViJ4-1683592135147)(C:\Users\quyanliang\AppData\Roaming\Typora\typora-user-images\1683592070705.png)]

  • 所以后端就算进行了排序处理,但是浏览器还是有自己的想法,在这里就要进行前端处理了:

  •                     //先把获取到的json对象转成map
                        let map = new Map();
                        //archive就是接口返回的json对象
                        for (let year in archive) {
                            map.set(year,archive[year]);
                        }
                        //把map转换为array就可以排序了
                        let arr = Array.from(map);
                        arr.sort(function (a,b) {
                            //map转成array后,下标0为key,下标1为value
                            //这里根据年份进行倒序排序
                            return b[0]-a[0];
                        });
                        console.log(arr)
    
  • 可以从打印信息看出来已经正确排序了:

  • [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-n7mKsFXf-1683592135147)(C:\Users\quyanliang\AppData\Roaming\Typora\typora-user-images\1683592110064.png)]

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

IT枫斗者

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值