javascript 前端 html 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])

}

})

})

参考链接