zoukankan      html  css  js  c++  java
  • js,javascript对象中键相同的数据合并,js对象的数据处理问题

    在开发过程中我们会遇到例如历史记录翻页,还有带有日期评论的论坛翻页,遇到对象键相同数据合并的问题

    在这里举个例子,这个需求是 历史评论 ,日期下面有评论数据,就是比如后端第一页返回的是10条数据,数据格式如下(第一页的数据):

    然后我们前端渲染是把键渲染出来就是日期的分割,然后键对应的数组就是渲染的数据

    这里就有个问题了,就是上拉加载到 第二页 的时候假如还有  2020-11-13的数据,那么渲染的时候日期就会变成有两个2020-11-13的日期分割线数据,下面的 第二页 的数据(注意这里是第二页请求回来的数据):

    显然这样与需求不符合,这样的话就需要我们把第二页中的2020-11-13和第一页的合并起来

    这里我们需要用到js的一个对象方法 :hasOwnProperty()


    它的作用是返回一个布尔值,判断对象是否包含特定的自身

    下面请看具体代码

     //这里ajax就写成你们请求的方法,data就是返回来的数据;这个ajax就是每一次上拉加载翻页请求一次的函数
    var centendata = {};
    ajax((data)=>{
            if(data.length!=0){
        //把对象键值循环出来
              for(var l in data){
                    for(var i in centendata){
         //如果键值相等就用数组处理方法把请求回来的数据push进去
                      if(i==l){
                          centendata[i].push(...data[l]);
                      }
                    }
        //如果没有这个键值,那么就赋值一个
                if(!centendata.hasOwnProperty(l)){
                    centendata[l]= data[l]
                }
              }
        })

    这样的话我们翻页就得到已经处理好  我们想要渲染的数据,如下

    请求第一页和下翻第二页的时候键相等的数据合并了:

  • 相关阅读:
    java.lang.ClassNotFoundException: org.jaxen.JaxenException
    hdu 4882 ZCC Loves Codefires(贪心)
    C++ STL 源代码学习(之deque篇)
    算法导论学习笔记(2)-归并排序
    机器学习方法:回归(一):线性回归Linear regression
    HDU 2028 Lowest Common Multiple Plus
    C++11新特性应用--实现延时求值(std::function和std::bind)
    大数减法
    hive 运行sqlclient异常
    Oracle 12c agent install for windows
  • 原文地址:https://www.cnblogs.com/taihe/p/14173334.html
Copyright © 2011-2022 走看看