如何将“键”：“值”对添加到“值”在不同数组上迭代的嵌套对象数组中？

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?

Answer 1

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 .