Question

我在简单的JavaScript 2D（画布）游戏中使用A* pathfinding script。我将游戏分解为SSCCE。无论如何，我的游戏是15列，10行。

问题是我得到的错误。下面我有一种方法来开始和结束节点之间的路径。以下是Uncaught TypeError: Cannot set property '0' of undefined上的错误消息line 15。第15行在第二个nodes[x][y] = new GraphNode(x, y, row[x]);循环之间为for。

这是我的SSCCE。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>    
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type='text/javascript' src='graphstar.js'></script>
<script type="text/javascript">
    var board;
</script>
<script type='text/javascript' src='astar.js'></script>
<script type="text/javascript">
    $(document).ready(function()
{
        // UP to DOWN - 10 Tiles (Y)
        // LEFT to RIGHT - 15 Tiles (X)
        graph = new Graph([
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], 
        [1, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 1], 
        [1, 13, 1, 13, 13, 13, 13, 13, 1, 1, 1, 1, 1, 13, 13, 1], 
        [1, 13, 1, 1, 13, 1, 1, 13, 1, 13, 13, 1, 13, 13, 13, 1], 
        [1, 13, 13, 1, 1, 1, 13, 13, 1, 13, 13, 1, 1, 1, 13, 1], 
        [1, 13, 13, 1, 13, 1, 13, 13, 13, 13, 13, 1, 13, 13, 13, 1], 
        [1, 13, 13, 13, 13, 1, 13, 13, 13, 13, 13, 1, 13, 13, 13, 1], 
        [1, 13, 1, 13, 13, 13, 13, 13, 1, 1, 1, 1, 13, 13, 13, 1], 
        [1, 13, 1, 1, 1, 1, 13, 13, 13, 13, 1, 13, 13, 13, 13, 1], 
        [1, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 1], 
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
        ]);
        //Let's do an example test.
        start = graph.nodes[1][2]; // X: 1, Y: 2
        end = graph.nodes[12][7]; // X: 12, Y: 7
        result = astar.search(graph.nodes, start, end);
    });
</script>
</head>
<body>
Loading... pathfinding. Look in Chrome Console/Firefox Firebug for more information.
</body>
</html>

如您所见，我的游戏是jQuery。还有graphstar.js和astar.js。不要担心astar.js，因为它运行正常。 graphstar.js是我的问题所在。 astar.js是nodes等等的布局。 graphstar.js是绘制地图的地方。

在此处查看整个graphstar.js：http://pastebin.com/5AYRreip（此处为astar.js：http://pastebin.com/ee6PMzc3）

这是graphstar.js中列出的地方：

function Graph(grid) {
    var nodes = [];
    var row, rowLength, len = grid.length;
    for (y = 0; y <= 15; y++) {
        row = grid[y];
        nodes[y] = new Array(15);
        for (x = 0; x <= 10; x++) {
            nodes[x][y] = new GraphNode(x, y, row[x]);
        }
    }
    this.input = grid;
    this.nodes = nodes;
}

因此，您可以看到...... Y可以是10或更低。 X可以是15或更低。但是，我收到了这个错误。

我输入end = graph.nodes[12][7]; // X: 12, Y: 7的位置应该工作，因为它在X和Y范围内...但是我甚至在设置它时遇到了麻烦。

为什么不定义？

更新

for (y = 0; y <= 10; y++) {

    row = grid[y];
    nodes[y] = new Array(15);

    for (x = 0; x <= 15; x++) {

        console.log("X: " + x + " Y: " + y);
        //console.log("Row: " + row[x]);
        nodes[x][y] = new GraphNode(x, y, row[x]);
    }
}

Answer 1

你的轴混乱了。

function Graph(grid) {
    var nodes = [];
    var row, rowLength, len = grid.length;
    for (y = 0; y <= 15; y++) {
        row = grid[y];
        // Here, you're indexing into `nodes` using `y`, so you're creating
        // an array at `nodes[0]` through `nodes[15]`
        nodes[y] = new Array(15);
        for (x = 0; x <= 10; x++) {
            // But here you're index into `nodes` using `x` in the first dimension,
            // so you're filling in `nodes[0][0]` through `nodes[10][15]`, not
            // `nodes[15][10]`.
            nodes[x][y] = new GraphNode(x, y, row[x]);
        }
    }
    this.input = grid;
    this.nodes = nodes;
}

因此，当您检索nodes[12]时，您会获得undefined，因为从未为该索引分配过值。然后你尝试索引它，并得到错误。

您需要确保始终使用一个坐标（x或y（无论您喜欢哪个）索引到外部数组中，并使用另一个坐标（{{ {1}}或y，无论您喜欢哪种方式。）

JavaScript - 未捕获的TypeError：无法设置未定义的属性“0”

1 个答案: