title: Iterating and processing JSON Object in recursive loop causes Stack Exceeded Error
body: <p>I am trying to build a HTML page using JS. The details of what needs to go into the HTML are sent in a json object from the server. Now the json object is structured in such a way that basically mimics the dom structure and I iterate through the object and fetch individual html element data from it and render the HTML string. The problem occurs when I use a recursive function to run through this object. I trigger a Stack Exceeded Error. I guess this is because of the limit on browser stack size. I would like to understand, what would be the best way I can iterate through this object to create the page without causing the script to fail.</p>
  
  <pre><code>pageObj Structure -&gt;
  
  //only a representation of object, the size is much larger.
  
  { "Default" : { "#text" : [ "\n  ",
            "\n"
          ],
        "MainForm" : { "#text" : [ "\n    ",
                "\n    ",
                "\n  "
              ],
            "shippingInfo" : { "#text" : [ "\n      ",
                    "\n      ",
                    "\n      ",
                    "\n      ",
                    "\n      ",
                    "\n      ",
                    "\n      ",
                    "\n    "
                  ],
                "@attributes" : { "title" : "Shipping Information",
                    "type" : "FormBlock"
                  },
                "Row" : [ { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "fName" : { "@attributes" : { "placeHolder" : "Enter First Name",
                              "title" : "First Name",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "lName" : { "@attributes" : { "placeHolder" : "Enter Last Name",
                              "title" : "Last Name",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "addr1" : { "@attributes" : { "title" : "Address 1",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "addr2" : { "@attributes" : { "title" : "Address 2",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n        ",
                          "\n      "
                        ],
                      "state" : { "@attributes" : { "title" : "State",
                              "type" : "text"
                            } },
                      "zipCode" : { "@attributes" : { "title" : "Zip Code",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n        ",
                          "\n      "
                        ],
                      "country" : { "@attributes" : { "title" : "Country",
                              "type" : "text"
                            } },
                      "phone" : { "@attributes" : { "title" : "Phone",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n        ",
                          "\n        ",
                          "\n        ",
                          "\n      "
                        ],
                      "day10" : { "@attributes" : { "title" : "10 day Shipping ($3)",
                              "type" : "radio"
                            } },
                      "day5" : { "@attributes" : { "title" : "5 Shipping ($10)",
                              "type" : "radio"
                            } },
                      "free" : { "@attributes" : { "title" : "Free Shipping ($0)",
                              "type" : "radio"
                            } },
                      "overNight" : { "@attributes" : { "title" : "One day Shipping ($20)",
                              "type" : "radio"
                            } }
                    }
                  ]
              },
            "userInfo" : { "#text" : [ "\n      ",
                    "\n      ",
                    "\n      ",
                    "\n    "
                  ],
                "@attributes" : { "title" : "User Information",
                    "type" : "FormBlock"
                  },
                "Row" : [ { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "TextBox" : { "@attributes" : { "placeHolder" : "Select an username",
                              "title" : "Username",
                              "type" : "text"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "TextBox" : { "@attributes" : { "placeHolder" : "Select a password",
                              "title" : "Password",
                              "type" : "password"
                            } }
                    },
                    { "#text" : [ "\n        ",
                          "\n      "
                        ],
                      "TextBox" : { "@attributes" : { "placeHolder" : "Eg: name@gmail.com",
                              "title" : "Email",
                              "type" : "text"
                            } }
                    }
                  ]
              }
          }
      } }
  </code></pre>
  
  <p>To iterate this object I use a technique below.</p>
  
  <pre><code>function iterateJsonObj(obj) {
      for(key in obj) {
          if(!obj.hasOwnProperty(key) || key=="#text") {
              continue;
          }
          else if(obj[key]["@attributes"]!=null)
          {
              htmlStr += createHTMLStr(obj[key], key);
          }
  
          iterateJsonObj(obj[key]);
      }
  }
  </code></pre>
  
  <p>Hope this question makes sense.</p>