My data structure consists of an array of objects like this:
arrOfObjs =
[{type: "flower", egg: "something"},
{type: "flower", egg: "something2"},
{type: "notFlower", egg: "something3"},
{type: "flower", egg: "something4"}]
Each object in the array has a 'type'. When a user clicks on an item, another object is added to the array with type either "flower" or "notFlower"
I also have a separate array structured like this:
allProperties =
["flower_style_1",
"flower_style_2",
"flower_style_3",
"flower_style_4",
"flower_style_5",
"flower_style_6",
"flower_style_7",
"flower_style_8"]
The naming convention for each item in allProperties is flower_style_ followed by a number up to 8.
For every item in arrOfObjs with type = "flower", as well as any new items added, I need to return a corresponding property from the allProperties array.
For example, based on the arrOfObjs provided:
- For {type: "flower", egg: "something"} => return "flower_style_1".
- For {type: "flower", egg: "something2"} => return "flower_style_2".
- No return value for {type: "notFlower", egg: "something3"} because it's not of type "flower".
- For {type: "flower", egg: "something4"} => return "flower_style_3".
- And so on...
Once all items in allProperties have been returned, the cycle starts from flower_style_1 and continues for each new item added to arrOfObjs.
I currently have a foreach loop iterating through arrOfObjs implemented as shown below:
this.arrOfObjs?.forEach(arrItem => {
if (arrItem.type === 'flower') {
this.allProperties.forEach(element => {
return element;
}
}
});
However, this approach does not function properly, and I am looking for a more efficient way to achieve this without relying on an array containing flower_style_.......
If you have any suggestions on how to accomplish the above scenario, I would greatly appreciate your input.