Reduce array of nested objects

Question

I have a dynamic array of nested objects as below:

[
    {
        "fields": [
            {
                "field-1": {
                    "id": "field-1",
                    "value": "a1"
                },
                "field-2": {
                    "id": "field-2",
                    "value": "a2"
                },
                "field-3": {
                    "id": "field-3",
                    "value": "a3"
                }
            }
        ]
    },
    {
        "fields": [
            {
                "field-1": {
                    "id": "field-1",
                    "value": "b1"
                },
                "field-2": {
                    "id": "field-2",
                    "value": "b2"
                },
                "field-3": {
                    "id": "field-3",
                    "value": "b3"
                }
            }
        ]
    }
]

I want to parse/reduce this array to below kind of structure:

[
    {
        "field-1": "a1",
        "field-2": "a2",
        "field-3": "a3"
    },
    {
        "field-1": "b1",
        "field-2": "b2",
        "field-3": "b3"
    },
]

While I already have a verbose way of iterating over the array and constructing the new one, I wanted to know if it is possible to get the structure using the reduce method, as that would be faster?

Answer 1

You can use reduce to do it

const result = raw
  .map(row => Object.entries(row.fields[0])
    .reduce((acc, [key, { value }]) => {
       acc[key] = value
       return acc
    }, {})
  )

console.log(result)

<script>
  const raw = [{
      "fields": [{
        "field-1": {
          "id": "field-1",
          "value": "a1"
        },
        "field-2": {
          "id": "field-2",
          "value": "a2"
        },
        "field-3": {
          "id": "field-3",
          "value": "a3"
        }
      }]
    },
    {
      "fields": [{
        "field-1": {
          "id": "field-1",
          "value": "b1"
        },
        "field-2": {
          "id": "field-2",
          "value": "b2"
        },
        "field-3": {
          "id": "field-3",
          "value": "b3"
        }
      }]
    }
  ]
</script>

Answer 2

You Can try this code

var convert=[];
for (let i=0; i< test.length; i++){
    var obj={};
    Object.entries(test[i]).forEach(entry => { 
        const [key, value] = entry; 
        for(let j=0; j < value.length; j++){
            Object.entries(value[j]).forEach(s => { var [ k,v ] = s; obj[k]= v.value  }); 
        }
    })
    convert[i]=obj
}
console.log(convert);

<script>
var test=[
    {
        "fields": [
            {
                "field-1": {
                    "id": "field-1",
                    "value": "a1"
                },
                "field-2": {
                    "id": "field-2",
                    "value": "a2"
                },
                "field-3": {
                    "id": "field-3",
                    "value": "a3"
                }
            }
        ]
    },
    {
        "fields": [
            {
                "field-1": {
                    "id": "field-1",
                    "value": "b1"
                },
                "field-2": {
                    "id": "field-2",
                    "value": "b2"
                },
                "field-3": {
                    "id": "field-3",
                    "value": "b3"
                }
            }
        ]
    }
];</script>