Javascript递归函数似乎在第一次通过后退出答案

【问题标题】：Javascript Recursive function seems to exit after first passJavascript递归函数似乎在第一次通过后退出
【发布时间】：2010-12-03 20:54:29
【问题描述】：

我试图在通过设置节点（index）递归时呈现树状层次结构。我已经知道根源（top）。有多个根元素。我正在尝试将整个 html 收集到变量 tree 中（整个 html 稍后将附加到 div）

tree = "";
top = ["1", "11", "14", "17", "72", "73", "74", "78", "79", "98", "99"];
index = {
    1: {
        'name': "Node 1",
        'children': "2,3,4,5,6,7,8,9,10"
    },
    2: {
        'name': "Node 2",
        'children': ""
    },

//.... goes all the way upto 99
}

递归函数 makeFT(index,roots) 似乎只在遍历“top”数组中第一个元素的子元素后才中断。

此代码位于jsbin 及以下。可能是什么问题呢？有一个更好的方法吗？任何帮助表示赞赏。

makeFT(index, top);


function makeFT(index, roots) {
    console.log(roots);
    tree == "" ? tree += '<ul>' : tree += '<ul><hr/>'
    for (i = 0; i < roots.length; ++i) {
        n = parseInt(roots[i]);
        //console.log(n);
        //console.log(index[n]);

        tree += '<li>' + roots[i] + '</span>' + index[n].name;

        if (index[n].children === "") {
            tree += '<input class="leaf tree-first-input" type="text" size="2">'
        }
        else {
            tree += '<input class="non-leaf tree-first-input" type="text" size="2">'
            makeFT(index, index[n].children.split(","));
        }
        tree += "</li>"
    }
    tree += '</ul><br/>'

}

更新：原来这是一个范围问题，而不是递归问题。递归没问题。由于我在遍历根数组时没有定义变量“i”的范围，因此每个后续的递归函数都继承了无范围的“i”的值，从而产生了问题。

【问题讨论】：

标签： javascript recursion

【解决方案1】：

在函数内部添加一个 var i=0。您对 i 的范围界定有问题。

http://jsbin.com/ugoju4/12/edit

【讨论】：

另外建议添加var n 和var tree 以避免将来出现错误
@Tomas，谢谢。是的，我将添加相关范围。错过了“var i”部分，因此每个后续的递归函数都继承了 i 的值。 rcravens 的绝妙发现。

【解决方案2】：

你没有从你的递归函数中返回任何东西。

  }
        else {
            tree += '<input class="non-leaf tree-first-input" type="text" size="2">'
            tree += makeFT(index, index[n].children.split(","));
        }
        tree += "</li>"
    }
    tree += '</ul><br/>'
    return tree;
 }

这应该会给你价值。使用它通过 Id 将其写入元素。更新了 jsfiddle

【讨论】：

我认为tree是一个全局定义的变量，所以这个函数一定不能返回任何值。
无论我是否返回值，都会出现此问题。自己试试吧。
@EvilMM 你应该检查更新的 jsfiddle 代码，jsbin.com/ugoju4/11/edit

【解决方案3】：

top 是一个全局变量，引用当前框架集的“顶部”窗口。使用不同的变量名。

【讨论】：

【解决方案4】：

为什么要在 for 语句中输入“++i”？使用“i++”
你正在输入

索引[n].children === ""

尝试一下

index[n].children == ""

我认为他从不参加 else-part。

【讨论】：

for 语句中的 i++ 或 ++i 完全没有区别。
另外，由于children是一个字符串，===是正确的运算符（-1）