Javascript：具有for-Loop的递归函数

Question

这是我要问的关于此功能的第三个问题（也许我现在应该完全重做一次）。

该函数将构建一个参数定义大小的网格，并插入来自函数（同样是参数定义）的数据。 我试图在包含唯一对象的网格中创建一个网格，尽管有很多问题在这里和这里都得到了很好的回答*谢谢@Bergi，我还有另一个：

这是代码，并在控制台上显示了一些日志，以显示其中的内容：

//Build a 3x3 grid constructor that can optionally pre-insert values into each cube
function buildGrid(rows,cols,dataFunction){
    console.log("Let's see, we have an order for "+rows+" rows, "+cols+" cols and within each,"+dataFunction);
    //check to see if dataFunction provided, and type
    if(arguments.length !== 3){
        dataFunction = function(){return 0;};
    }

    var customGrid = [];

    //create grid
    for(row=0;row<rows;row++){console.log("creating row "+(row+1)+" of "+rows);
        var customRow = [];
        for(col=0;col<cols;col++){console.log("creating col "+(col+1)+" of "+cols);

            if(typeof dataFunction == 'function'){
                data = dataFunction(); 
            }

            else{
                data = dataFunction;
            }

            customRow.push(data);console.log("finished col "+(col+1)+" of "+cols);

        }
        customGrid.push(customRow);console.log("finished row "+(row+1)+" of "+rows);
    }
    console.log("Grid completed");
    return customGrid;
}

函数调用如下所示：

var myGrid=buildGrid(3,3,function(){return buildGrid(2,2,buildSquare)});

buildSquare只是一个构造函数。

现在这是控制台日志：

evalresult[eval12][52]:  
Let's see, we have an order for 3 rows, 3 cols and within each, function (){return buildGrid(2,2,buildSquare)}
evalresult[eval12][61]:  
creating row 1 of 3
evalresult[eval12][63]:  
creating col 1 of 3
evalresult[eval12][52]:  
Let's see, we have an order for 2 rows, 2 cols and within each, function buildSquare(){counter++;return new Square();}
evalresult[eval12][61]:  
creating row 1 of 2
evalresult[eval12][63]:  
creating col 1 of 2
evalresult[eval12][73]:  
finished col 1 of 2
evalresult[eval12][63]:  
creating col 2 of 2
evalresult[eval12][73]:  
finished col 2 of 2
evalresult[eval12][76]:  
finished row 1 of 2
evalresult[eval12][61]:  
creating row 2 of 2
evalresult[eval12][63]:  
creating col 1 of 2
evalresult[eval12][73]:  
finished col 1 of 2
evalresult[eval12][63]:  
creating col 2 of 2
evalresult[eval12][73]:  
finished col 2 of 2
evalresult[eval12][76]:  
finished row 2 of 2
evalresult[eval12][78]:  
Grid Completed
evalresult[eval12][73]:  
finished col 3 of 3
evalresult[eval12][76]:  
finished row 3 of 3
evalresult[eval12][78]:  
Grid Completed

发现问题了吗？ 首先，较大的3x3函数开始，并在“ data = dataFunction（）;”处开始对内部2x2函数的调用。 2x2函数完成后，该函数应跳至3x3网格的下一部分，但返回的网格不完整。 我认为for循环变量（即“行”和“ cols”）将与它们较小范围内的值相关联，并且内部2x2网格的FOR变量不会影响3x3网格中外部范围的FOR变量。 这是怎么回事吗？

我在这里想念什么？

非常感谢大家。

Answer 1

您需要在函数内部使用var声明变量“ row”。 就目前而言，变量是全局变量，因此，当对“ buildGrid”进行嵌套调用时，该代码将操纵相同的变量。

也用var声明“数据”。 养成的好习惯是把

"use strict";

在整个JavaScript块的顶部，或者如果有问题，至少在函数的顶部。 这将运行时置于“严格”模式，在这种模式下，无法像这样声明变量将导致错误。