How to add a 'key': 'value' pair to a nested array of objects where the 'value' iterates over a different array?

Question

I have an array of objects like so where there can be more or less items:

arrOfItems = [
    {
        "type": "apple",
        "earth: "blue"
    }
    {
        "type": "orange",
        "attrs": {
            "id": 21,
            "data": "RET",
            "data2": null,
            "order": null,
            "order2": null,
            "type": "property",
            "char": "@"
        }
    },
    {
        "type": "apple",
        "earth: "green"
    },
    {
        "type": "apple",
        "earth: "yellow"
    },
    {
        "type": "orange",
        "attrs": {
            "id": 28,
            "data": "EMC",
            "data2": null,
            "order": null,
            "order2": null,
            "type": "property",
            "char": "@"
        }
    },
]

Each item inside the array has a structure. So if "type" = "apple" then another key will be added "earth". If "type" = "orange", another key "attrs" will be added which is in the following structure:

"attrs": {
    "id":,
    "data": "",
    "data2": null,
    "order": null,
    "order2": null,
    "type": "",
    "char": ""
}

For each item with type: "orange", how can I add a key 'class' to the attrs object where that key is assigned to an item from the following array:

arrOfProps = ["prop_1", "prop_2", "prop_3", "prop_4" "prop_5", "prop_6"]

For example, based on the arrOfItems above, how do I get to the following:

arrOfItems = [
    {
        "type": "apple",
        "earth: "blue"
    }
    {
        "type": "orange",
        "attrs": {
            "class": "prop_1",
            "id": 21,
            "data": "RET",
            "data2": null,
            "order": null,
            "order2": null,
            "type": "property",
            "char": "@"
        }
    },
    {
        "type": "apple",
        "earth: "green"
    },
    {
        "type": "apple",
        "earth: "yellow"
    },
    {
        "type": "orange",
        "attrs": {
            "class": "prop_2",
            "id": 28,
            "data": "EMC",
            "data2": null,
            "order": null,
            "order2": null,
            "type": "property",
            "char": "@"
        }
    },
    ......... For the next item with "type": "orange", we have "class": "prop_3", etc.
]

So far, I have:

arrOfItems.forEach( element =>
    if(element.type === "orange") {
        obj.attrs["class"] = arrOfProps[??];
    }
)

However I'm not sure how to go further. Would anyone have any idea?

Kelvin Schoofs · Accepted Answer · 2021-07-22 15:53:41Z

You can simply iterate over this while keeping track of the assigned props:

const arrOfItems = [
    { type: 'apple', earth: 'blue' },
    {
        "type": "orange",
        "attrs": {
            "id": 21,
            "data": "RET",
            "data2": null,
            "order": null,
            "order2": null,
            "type": "property",
            "char": "@"
        }
    },
    { type: 'apple', earth: 'green' },
    { type: 'apple', earth: 'yellow' },
    {
        "type": "orange",
        "attrs": {
            "id": 28,
            "data": "EMC",
            "data2": null,
            "order": null,
            "order2": null,
            "type": "property",
            "char": "@"
        }
    },
]

const arrOfProps = ["prop_1", "prop_2", "prop_3", "prop_4", "prop_5", "prop_6"];

let nextProp = 0;
for (const element of arrOfItems) {
    if (element.type !== 'orange') continue;
    element.attrs.class = arrOfProps[nextProp++];
}

console.log(arrOfItems);

Of course, if you have more oranges than elements in arrOfProps, then class will be assigned to undefined.

Collectives™ on Stack Overflow

How to add a 'key': 'value' pair to a nested array of objects where the 'value' iterates over a different array?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related