Extracting values from array-attributes of a JSON array

Question

I have an array of elements and each element is super-complex because its attributes are arrays which contains other arrays as properties. I want to extract just few attributes of this element, I've tried with the forEach function but it doesn't work.

The array comes from a json file, that's why I use axios, and the elements of the array are something like this:

{
    "ITEMS":[
        {
            "id":"0001",
            "name":"foo",
            "sizes":[
                {
                    "name":"small",
                    "id":"9999",
                    "available":"no"
                },
                {
                    "name":"medium",
                    "id":"9998",
                    "available":"yes"
                }
            ]
        },

        {
            "id":"0002",
            "name":"bar",
            "sizes":[
                {
                    "name":"small",
                    "id":"4444",
                    "available":"yes"
                },
                {
                    "name":"medium",
                    "id":"4443",
                    "available":"no"
                }
            ]
        },
        ...
    ]
}

So I want to collect the their attributes creating elements that are PUSHED in an array and that replicate this model:

this.sample = {
    colour:'item.name',
    size:'item.size.name[i]',
    idcode:'item.id',
    sizecode:'item.size.id[i]',
    available:'item.size.available[i]'
}

this is my attempt (not working)

const axios = require('axios');
class IndianaJones {
    constructor(){
        this.sample = {
            name:'',
            colour:'',
            size:'',
            idcode:'',
            sizecode:'',
            available:''
        },
        this.newids = ["10","11","12"...]
        this.freshprods = []
    }

    async FreshProd(){
        for(this.i=0;this.i<this.newids.length;this.i++){
            this.prod = await axios.get(`https://blablabla/${this.newids[this.i]}.json`)
            this.ITEMS.forEach(function(item){
                this.sample.idcode=item.id;
                this.sample.colour=item.name;
                item.sizes.forEach(function(SIZE){
                    this.sample.size=SIZE.name
                    this.sample.sizecode=SIZE.id
                    this.sample.available=SIZE.available
                    this.freshprods.push(this.sample)
                })
            }
            )
        }
        return this.freshprods
    }
}

(async()=>{
    const indiana = new IndianaJones();
    await indiana.FreshProd()
})()

Really, this is driving me up to wall, i would be SO GRATEFUL for anyone who can help me, maybe LODASH could be useful?

Answer 1

let prod = {
    "ITEMS":[
        {
            "id":"0001",
            "name":"foo",
            "sizes":[
                {
                    "name":"small",
                    "id":"9999",
                    "available":"no"
                },
                {
                    "name":"medium",
                    "id":"9998",
                    "available":"yes"
                }
            ]
        },
        {
            "id":"0002",
            "name":"bar",
            "sizes":[
                {
                    "name":"small",
                    "id":"4444",
                    "available":"yes"
                },
                {
                    "name":"medium",
                    "id":"4443",
                    "available":"no"
                }
            ]
        }
    ]
}

let freshprods = [];
prod.ITEMS.forEach(function(item){
    item.sizes.forEach(function(SIZE){
        freshprods.push({
            idcode: item.id,
            colour: item.name,
            size: SIZE.name,
            sizecode: SIZE.id,
            available: SIZE.available
        })
    })
})
console.log(freshprods);

Output

[ { idcode: '0001',
    colour: 'foo',
    size: 'small',
    sizecode: '9999',
    available: 'no' },
  { idcode: '0001',
    colour: 'foo',
    size: 'medium',
    sizecode: '9998',
    available: 'yes' },
  { idcode: '0002',
    colour: 'bar',
    size: 'small',
    sizecode: '4444',
    available: 'yes' },
  { idcode: '0002',
    colour: 'bar',
    size: 'medium',
    sizecode: '4443',
    available: 'no' } ]

Answer 2

You are trying to flatten the structure. To so you can use Array.flatMap() (or lodash's _.flatMap() to iterate the ITEMS , map the sizes array, and return a new object for each size:

 const prods = {"ITEMS":[{"id":"0001","name":"foo","sizes":[{"name":"small","id":"9999","available":"no"},{"name":"medium","id":"9998","available":"yes"}]},{"id":"0002","name":"bar","sizes":[{"name":"small","id":"4444","available":"yes"},{"name":"medium","id":"4443","available":"no"}]}]}; const freshprods = prods.ITEMS.flatMap( ({ id: idcode, name: colour, sizes }) => sizes.map(o => ({ colour, size: o.name, idcode, sizecode: o.id, available: o.available })) ); console.log(freshprods);