Javascript:在函数内调用函数并覆盖变量

时间:2011-08-26 01:14:34

标签: javascript

我在JavaScript中有一个可以尽可能深入的数组:

 var steps = [
    { "step_id" : "1", "step_name" : "Step 1", "children" : 
        [ 
            { "step_id" : "4", "step_name" : "Step 4", "children" : 
                [ 
                    { "step_id" : "6", "step_name" : "Step 6" }
                ] 
             },
            { "step_id" : "5", "step_name" : "Step 5" } 
        ] 
    }, 
    { "step_id" : "2", "step_name" : "Step 2" }, 
    { "step_id" : "3", "step_name" : "Step 3" }
];

然后,我想在选择下拉框中显示每个步骤。对于每个孩子的步骤,我想缩进它。这是我的JS

 function stepsChildren(children, count) {
    var new_count = count + 1;
    var selection_values_children = '';
    for(j=0;j<children.length;j++) {
        selection_values_children += '<option value="' + children[j].step_id + '">';
        for(x=1;x<=count;x++) {
            selection_values_children +='&nbsp;&nbsp;&nbsp;';
        }
        selection_values_children += children[j].step_name + '</option>';
        if (typeof(children[j].children) != 'undefined')
            selection_values_children += stepsChildren(children[j].children, new_count);
    }
    return selection_values_children;
}

var selection_values = '';
for(i=0;i<steps.length;i++) {
    selection_values += '<option value="' + steps[i].step_id + '">' + steps[i].step_name + '</option>';
    if (typeof(steps[i].children) != 'undefined')
        selection_values += stepsChildren(steps[i].children, 1);
}

document.write('<select>' + selection_values + '</select>');

这几乎可以在 stepsChildren()函数中运行,每次调用时, j 变量都会被覆盖。这几乎就像是将 j 设置为全局变量。

我有道理吗?

如果没有,我会整理一个样本供您查看:http://jsfiddle.net/CJbnm/

如果您运行代码并查看右侧的选择框,请注意数组中的步骤5是如何丢失的?

这是因为步骤4中只有一个孩子将 j 变量更新为1而不是父函数的2,并且不再显示任何结果......

1 个答案:

答案 0 :(得分:7)

如果您不使用var关键字创建变量,那么它将是全局的,您将获得所描述的行为。在javascript中我总是使用像for这样的for(var i=0;i<10;i++)循环,因为在使用循环时我几乎从不打算让循环变量成为全局变量。我相信这是你的问题。