多维数组包含对象如何批量修改属性值内容。

Question

数组里面有多个对象，对象里面又套个数组，如何批量分割对象数组里面的内容？

自己练习做vue项目，从后端接口返回来的数据格式是arr1这样的，通过v-for遍历渲染以后参数和值紧挨一起，设计图里面需要给参数单独的颜色，并且参数和值之前要有距离。我的思路要通过遍历数组再使用split(":")分割出新的数组arr2。

// 初始数据格式
var arr1 = [{
        id:'1',
        info:['体重:44kg','是否合身:合身','身高:166cm']
    },{
        id:'2',
        info:['体重:39kg','身高:122cm']
    }]
// 遍历修改后数据格式
var arr2 = [{
        id:'1',
        info:[{
                key:'体重',
                val:'44kg'
            },{
                key:'是否合身',
                val:'合身'
            },{
                key:'身高',
                val:'166cm'
            },
        ]
    },{
        id:'2',
        info:[{
                key:'体重',
                val:'39kg'
            },{
                key:'身高',
                val:'122cm'
            }
        ]
    }]

学vue中好多JavaScript东西都忘了，哭了，套娃遍历了一下午都没解决

Answer 1

arr.forEach(o => o.info = o.info.map(i => {
    const [ key, val ] = i.split(":")
    return { key, val }
}))

PS 这年头怎么还有人用 var