How to iterate through multidimensional javascript array of objects

Question

I would like to enquire some information about looping in javascript. I have an object that looks:

[
  {
    "pageId": "1",
    "menuPos": "Parent",
    "mainPageId": "1",
    "subMenu": [
      {
        "pageId": "1",
        "menuPos": "Parent and child",
        "mainPageId": "1",
        "subMenu": [
          {
            "pageId": "67",
            "menuPos": "Child",
            "mainPageId": "67"
          },
          {
            "pageId": "68",
            "menuPos": "Child and paren",
            "mainPageId": "68",
            "subMenu": [
              {
                "pageId": "70",
                "menuPos": "Child",
                "mainPageId": "70"
              },
              {
                "pageId": "69",
                "menuPos": "Child",
                "mainPageId": "69"
              }
            ]
          }
        ]
      }
    ]
  }
]

I've tried to use "key in array" but using this i can only reach first level of my array. The problem is that i don't know how many levels will be in this array.

I want to assing some information from this array to a new arrays object and send it to the server.

It has to look like this.

[
    {
        "pageId": "1",
        "menuPos": "Parent",
        "subMenu": [
            {
                "pageId": "1",
                "menuPos": "Parent and child",
                "parentId":1,
                "subMenu": [
                    {
                        "pageId": "67",
                        "menuPos": "Child",
                        "parentId": 1,
                    },
                    {
                        "pageId": "68",
                        "menuPos": "Parent and child",
                        "parentId": 1,
                        "subMenu": [
                            {
                                "pageId": "70",
                                "menuPos": "Child",
                                "parentId": 68,
                            },
                            {
                                "pageId": "69",
                                "menuPos": "Child",
                                "parentId": 68,
                            }
                        ]
                    }
                ]
            }
        ]
    }
]

What are you actually trying to find? And for a hint: "recursion" is what you're looking for here. — jmar777
– jmar777, Commented Jul 28, 2015 at 15:18
I want to get "menuPos" and "pageId" of every element in my array and put it to the new object. — mtch9
– mtch9, Commented Jul 28, 2015 at 15:23

tymeJV · Accepted Answer · 2015-07-28 15:19:43Z

1

You can use a recursive function, and only use the key in syntax for objects, arrays are standard loops:

function iterateMenus(menu) {
    for (var i = 0; i < menu.length; i++) {
        console.log(menu[i].pageId); //log more if ya want

        if (menu[i].hasOwnProperty("subMenu") && typeof menu[i].subMenu === "object") {
            iterateMenus(menu[i].subMenu);
        }
    }
}

answered Jul 28, 2015 at 15:19

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

mtch9 Over a year ago

Wow, thanks man it is working now! I would also like to now is it possible using this function to make the output structure like i show in my post?

Collectives™ on Stack Overflow

How to iterate through multidimensional javascript array of objects

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related