js 将对象转换为数组,两个对象的属性相同合并相加

1、定义两个对象,属性相同的值相加,并将值赋值为数组中对象属性相同的
  • 定义数组

    var titleDate = [
    {
    name: 'JKJInputQty',
    field: 'restQty',
    icon: config.ossUrl + '/afl-data-screen/images/icon-all-input.png',
    value: 0,
    titleNames: 'JKJInputQty',
    span: 3
    }, {
    name: 'JKJOutputQty',
    field: 'restQty',
    icon: config.ossUrl + '/afl-data-screen/images/icon-takeOut.png',
    value: 0,
    titleNames: 'JKJOutputQty',
    span: 3
    }, {
    name:'PEOutputQty',
    field: 'restQty',
    icon: config.ossUrl + '/afl-data-screen/images/icon-output.png',
    value: 0,
    titleNames: 'PEOutputQty',
    span: 3
    }, {
    name: 'abnormalCause',
    field: 'restQty',
    icon: config.ossUrl + '/afl-data-screen/images/icon-search.png',
    cause: '',
    titleNames: 'AbnormalCause',
    span: 5
    }]

  • 定义两个对象

    var ProductDataByDayofLine1= {
    "JKJInputQty": 3276,
    "JKJOutputQty": 9890,
    "PEOutputQty": 8442,
    "DROutputQty": 10584,
    "JKJOutputDifferenceQty": 6614,
    "PEOutputDifferenceQty": 0,
    "DROutputDifferenceQty": 2142,
    "AbnormalCause": "JKJ产出数量大于投入数量DR产出数量大于PE产出数量"
    }
    var ProductDataByDayofLine2= {
    "JKJInputQty": 0,
    "JKJOutputQty": 0,
    "PEOutputQty": 0,
    "DROutputQty": 0,
    "JKJOutputDifferenceQty": 0,
    "PEOutputDifferenceQty": 0,
    "DROutputDifferenceQty": 0,
    "AbnormalCause": ""
    },

  • 将连个对象合并相加

    const keys = Object.keys(ProductDataByDayofLine1)
    keys.forEach((name, index) => {
    titleDate.forEach(item => {
    if (name === item.titleNames && index < 4) {
    item.value = Number(ProductDataByDayofLine1[name]) + Number(ProductDataByDayofLine2[name])
    }
    if (name === item.titleNames && item.titleNames === 'JKJOutputDifferenceQty') {
    // Number() 将值转换类型为数字类型
    const a = Number(ProductDataByDayofLine1[name]) + Number(ProductDataByDayofLine2[name])
    const b = Number(ProductDataByDayofLine1.PEOutputDifferenceQty) + Number(ProductDataByDayofLine2.PEOutputDifferenceQty)
    const c = Number(ProductDataByDayofLine1.DROutputDifferenceQty) + Number(ProductDataByDayofLine2.DROutputDifferenceQty)
    item.value = a + b + c
    }
    //特定的判断条件去添加到titleDate数组属性中
    if (name === item.titleNames && item.titleNames === 'AbnormalCause') {
    item.cause = res.ProductDataByDayofLine1[name] + ProductDataByDayofLine2[name]
    }
    })
    })

2、将对象转换为数组并合并对象

数据格式为

复制代码
var ProductDataByHourofLine1= {
        "HourOne": {
            "JKJInputQty": 0,
            "JKJOutputQty": 0,
            "PEOutputQty": 0,
            "DROutputQty": 0,
            "JKJOutputDifferenceQty": 0,
            "PEOutputDifferenceQty": 0,
            "DROutputDifferenceQty": 0,
            "AbnormalCause": null
        },
        "HourTwo": {
            "JKJInputQty": 0,
            "JKJOutputQty": 0,
            "PEOutputQty": 0,
            "DROutputQty": 0,
            "JKJOutputDifferenceQty": 0,
            "PEOutputDifferenceQty": 0,
            "DROutputDifferenceQty": 0,
            "AbnormalCause": null
        },
        "HourThree": {
            "JKJInputQty": 0,
            "JKJOutputQty": 0,
            "PEOutputQty": 0,
            "DROutputQty": 0,
            "JKJOutputDifferenceQty": 0,
            "PEOutputDifferenceQty": 0,
            "DROutputDifferenceQty": 0,
            "AbnormalCause": null
        },
        "HourFour": {
            "JKJInputQty": 0,
            "JKJOutputQty": 0,
            "PEOutputQty": 0,
            "DROutputQty": 0,
            "JKJOutputDifferenceQty": 0,
            "PEOutputDifferenceQty": 0,
            "DROutputDifferenceQty": 0,
            "AbnormalCause": null
        },
        
}

var ProductDataByHourofLine2= {
        "HourOne": {
            "JKJInputQty": 0,
            "JKJOutputQty": 0,
            "PEOutputQty": 0,
            "DROutputQty": 0,
            "JKJOutputDifferenceQty": 0,
            "PEOutputDifferenceQty": 0,
            "DROutputDifferenceQty": 0,
            "AbnormalCause": null
        },
        "HourTwo": {
            "JKJInputQty": 0,
            "JKJOutputQty": 0,
            "PEOutputQty": 0,
            "DROutputQty": 0,
            "JKJOutputDifferenceQty": 0,
            "PEOutputDifferenceQty": 0,
            "DROutputDifferenceQty": 0,
            "AbnormalCause": null
        }
      //......后面定义省略
}
  • 转换对象并添加到新的数组中

    let arr=[]
    let arr2=[]
    Object.entries(ProductDataByHourofLine1).forEach((item, index) => {
    if (item[0] === 'HourOne') {
    item[1].TimePeriod = '00:00 ~ 01:00'
    arr.push(item[1])
    }
    if (item[0] === 'HourTwo') {
    item[1].TimePeriod = '01:00 ~ 02:00'
    arr.push(item[1])
    }
    if (item[0] === 'HourThree') {
    item[1].TimePeriod = '02:00 ~ 03:00'
    arr.push(item[1])
    }
    if (item[0] === 'HourFour') {
    item[1].TimePeriod = '03:00 ~ 04:00'
    arr.push(item[1])
    }
    })

    Object.entries(ProductDataByHourofLine2).forEach((item, index) => {
    if (item[0] === 'HourOne') {
    item[1].TimePeriod = '00:00 ~ 01:00'
    arr2.push(item[1])
    }
    if (item[0] === 'HourTwo') {
    item[1].TimePeriod = '01:00 ~ 02:00'
    arr2.push(item[1])
    }
    if (item[0] === 'HourThree') {
    item[1].TimePeriod = '02:00 ~ 03:00'
    arr2.push(item[1])
    }
    if (item[0] === 'HourFour') {
    item[1].TimePeriod = '03:00 ~ 04:00'
    arr2.push(item[1])
    }
    })

  • 将两个数组中对象相同的合并相加 到某一个数组的属性上

    arr.forEach((item, index) => {
    var item2 = arr2[index]
    var a = Object.keys(item)
    var b = Object.keys(item2)
    a.forEach((x, index) => {
    if (x === b[index] && x !== 'TimePeriod') {
    item[x] = Number(item[x]) + Number(item2[x])
    }
    })
    })

相关推荐
福兮说8 小时前
设计稿是 #4A7C6F,页面量出来是 #4B7C6F:HEX、HSL、透明度、canvas 来回转的七个坑
前端·javascript·css·canvas
郑州光合科技余经理9 小时前
海外版外卖加盟:总站与分站配送规则怎么分开管
java·开发语言·前端·后端·uni-app·php·ai编程
小呆呆66610 小时前
副业搞起来,小说,漫画,漫剧的成本优化思路
前端·后端·面试
凤城老人10 小时前
从 PyQt6 到 Electron:给 Edge TTS 做一个“多角色配音机“的踩坑手记
javascript·typescript·electron
Dovis(誓平步青云)10 小时前
浇水提醒刚弹出又消失,植物状态别只存一个百分比
开发语言·前端·javascript·pdf·ecmascript·电脑
码艺-Alimjan10 小时前
Vben Admin 新增维吾尔语 Vben-Modal的关键坑之一
前端·javascript·vue.js
可乐鸡翅yeah_11 小时前
hls.js 手动自定义 http 请求 loader,修改请求头实战
开发语言·前端·javascript·网络协议·http·ecmascript·m3u8在线
IT_陈寒11 小时前
Vite静态资源导入这个坑我帮你们踩过了
前端·人工智能·后端
广州华水科技11 小时前
大坝安全监测解决方案:单北斗GNSS形变监测系统应用与维护
前端
yivifu12 小时前
中文古籍电子书注释集成
前端·javascript·python·beautifulsoup·epub