如何在JS中格式化对象数组

时间:2019-05-29 01:30:02

标签: javascript arrays object vue.js ecmascript-6

我想在VueJS的一个计算属性中格式化该数组,但是在访问newArray的那一刻我遇到一个问题,所有元素都在一个数组中

getNewArray(){
const newArray = []
const = this.data.map(item =>{
    for(let i in item){
       newArray.push(item.value)
  }
return newArray
})
}
data:[
    [
    {idStatus: 2, value: '120'},
    {idStatus: 3, value: '130'},
    {idStatus: 4, value: '140'},
    {idStatus: 5, value: '150'}
    ],
    [
    {idStatus: 1, value: '160'},
    {idStatus: 2, value: '180'},
    {idStatus: 4, value: '10'},
    {idStatus: 5, value: '20'}
    ],
    [
    {idStatus: 3, value: '567'},
    {idStatus: 6, value: '234'},
    {idStatus: 9, value: '747'},
    {idStatus: 7, value: '789'}
    ],
    [
    {idStatus: 8, value: '340'},
    {idStatus: 5, value: '560'},
    {idStatus: 6, value: '120'},
    {idStatus: 2, value: '100'}
    ],
    [
    {idStatus: 1, value: '106'},
    {idStatus: 5, value: '345'},
    {idStatus: 7, value: '756'},
    {idStatus: 9, value: '946'}
    ]
    ]

我想要获得的结果是这个

    data:[
    [120,130,140,150],
    [160,180,10,20],
    [567,234,747,789],
    [340,560,120,100],
    [106,345,756,946]
    ]

3 个答案:

答案 0 :(得分:1)

使用map

const data = [[{idStatus:2,value:'120'},{idStatus:3,value:'130'},{idStatus:4,value:'140'},{idStatus:5,value:'150'}],[{idStatus:1,value:'160'},{idStatus:2,value:'180'},{idStatus:4,value:'10'},{idStatus:5,value:'20'}],[{idStatus:3,value:'567'},{idStatus:6,value:'234'},{idStatus:9,value:'747'},{idStatus:7,value:'789'}],[{idStatus:8,value:'340'},{idStatus:5,value:'560'},{idStatus:6,value:'120'},{idStatus:2,value:'100'}],[{idStatus:1,value:'106'},{idStatus:5,value:'345'},{idStatus:7,value:'756'},{idStatus:9,value:'946'}]];
const res = data.map(e => e.map(({ value }) => value));
console.log(res);
.as-console-wrapper { max-height: 100% !important; top: auto; }

答案 1 :(得分:0)

您不应该将for .. in用于数组迭代#Ref

您可以通过解决以下问题来将原始代码更改为此

  • 您每次都将值推向相同的newArray,而每次都必须在map内每次创建一个新变量
  • 您不会从函数中返回任何内容

let data =[[{idStatus: 2, value: '120'},{idStatus: 3, value: '130'},{idStatus: 4, value: '140'},{idStatus: 5, value: '150'}],[{idStatus: 1, value: '160'},{idStatus: 2, value: '180'},{idStatus: 4, value: '10'},{idStatus: 5, value: '20'}],[{idStatus: 3, value: '567'},{idStatus: 6, value: '234'},{idStatus: 9, value: '747'},{idStatus: 7, value: '789'}],[{idStatus: 8, value: '340'},{idStatus: 5, value: '560'},{idStatus: 6, value: '120'},{idStatus: 2, value: '100'}],[{idStatus: 1, value: '106'},{idStatus: 5, value: '345'},{idStatus: 7, value: '756'},{idStatus: 9, value: '946'}]]

function getNewArray(){
const final = data.map(item =>{
    const newArray = []
    for(let i of item){
       newArray.push(i.value)
    }
    return newArray
})
return final
}

 
console.log(getNewArray())

您可以使用地图两次

let data = {data:[[{idStatus: 2, value: '120'},{idStatus: 3, value: '130'},{idStatus: 4, value: '140'},{idStatus: 5, value: '150'}],[{idStatus: 1, value: '160'},{idStatus: 2, value: '180'},{idStatus: 4, value: '10'},{idStatus: 5, value: '20'}],[{idStatus: 3, value: '567'},{idStatus: 6, value: '234'},{idStatus: 9, value: '747'},{idStatus: 7, value: '789'}],[{idStatus: 8, value: '340'},{idStatus: 5, value: '560'},{idStatus: 6, value: '120'},{idStatus: 2, value: '100'}],[{idStatus: 1, value: '106'},{idStatus: 5, value: '345'},{idStatus: 7, value: '756'},{idStatus: 9, value: '946'}]]}

function getNewArray(){
const final= data.data.map(val=> val.map(({value})=>value))
return final
}


console.log(getNewArray())

答案 2 :(得分:0)

for(let b=0; b < fields.length; b++)

print:[[120,130,140,​​150],[160,180,10,20],[567,234,747,789],[340,560,120,100],[106,345,756,946]]