Javascript在未知深度对象中迭代

我正在做的事情的一点历史…
我有一个php脚本，它将扫描一个目录（以及所有子目录和子目录等），并将其存储在一个数组中，然后将其转换为JSON（强制对象）字符串

然后我有一个javascript AJAX查询，它将从php页面获取JSON字符串，并将其解析回javascript对象

我试图做的是遍历对象（深度未知），并将其显示为列表。如果它是一个文件，给它一个关于使用递归函数的

。

但是，我想存储该值，直到它完全完成迭代

我想在更高的范围（可能是“全局”）中使用变量会起作用，只要在每次函数运行时将值附加到变量。。。但是还有别的办法吗？

我走对了吗？还是有更好/更有效的方法

我发现的很多东西都是关于迭代已知深度的多维数组/对象，而在这里，深度将与目录结构一样深

下面是我正在使用atm的JSON对象

{“mainPackage”：{“0”：“test.xml”}，“somePackage”：{“0”：“anotherFunction.xml”，“deep”：{“0”：“ohYouFoundMe.xml”}，“1”：“someFunction.xml”}

如果需要更多的代码等，请告诉我。

提前感谢您的帮助：）
只需重复以下内容：

function populateFunction(arr){
    var mainContain=document.createElement('ul');
    function iterateThrough(obj,elt){
        Object.keys(obj).forEach(function(curKey){
            if(typeof obj[curKey]==='object'){
                var li=document.createElement('li');
                var tn=document.createTextNode(curKey);
                var ul=document.createElement('ul');
                li.appendChild(tn);
                li.appendChild(ul);
                elt.appendChild(li);
                iterateThrough(obj[curKey],ul);
            }
            else{
                var li=document.createElement('li');
                var aElt=document.createElement('a');
                //you'd want to add other stuff (such as href or onclick) to the a element here
                aElt.textContent=curKey;
                li.appendChild(aElt);
                elt.appendChild(li);
            }
        });
    }
    iterateThrough(arr,mainContain);
    return mainContain;
}

我不确定它在技术上是否符合递归函数的条件，因为它不依赖于
返回
，但它基本上是这样做的。还要注意，它返回的是一个DOM元素，而不是像原始的、不完整的函数那样返回的字符串，因此需要考虑这一点。工作示例：
请尽量避免
for in
循环。最好使用
Object.keys
进行迭代。这不是一个答案，它只是一个很好的实践，使您的编码总体上更好，并避免错误。因此，使用DOM而不是HTML作为字符串递归函数，它将沿着您希望保留计数器的对象传递，这将比全局函数好一点。此外，考虑在DOM中构建GyHTML，而不是将其作为大字符串。特别是在手机上，直接添加到文档中比解析出字符串要快得多。如果您只关心输出HTML，那么如果您在每次递归时都在函数中添加child（）a
，并且在循环时在函数中添加一个
，则可以完全避免任何类型的变量作用域问题。好的，谢谢，请记住：）而且我实际上没有想到将它生成的信息传递回自身，好主意：）多谢了，这几乎解决了我的问题：）
function populateFunctions(arr){

  var genHTML = "";
  for (key in arr){
    if (typeof arr[key] === "string"){
      var fname = arr[key]
      //remove the extension, don't need it
      fname = fname.substring(0, fname.length - 4);
      genHTML = genHTML + "<li><a onClick=\"\">" + fname + "</a></li>\n";
    } else {
    }

  }
    return genHTML;
  }
}

function populateFunction(arr){
    var mainContain=document.createElement('ul');
    function iterateThrough(obj,elt){
        Object.keys(obj).forEach(function(curKey){
            if(typeof obj[curKey]==='object'){
                var li=document.createElement('li');
                var tn=document.createTextNode(curKey);
                var ul=document.createElement('ul');
                li.appendChild(tn);
                li.appendChild(ul);
                elt.appendChild(li);
                iterateThrough(obj[curKey],ul);
            }
            else{
                var li=document.createElement('li');
                var aElt=document.createElement('a');
                //you'd want to add other stuff (such as href or onclick) to the a element here
                aElt.textContent=curKey;
                li.appendChild(aElt);
                elt.appendChild(li);
            }
        });
    }
    iterateThrough(arr,mainContain);
    return mainContain;
}