Javascript洪水填充算法陷入无限循环

Question

您好我正在尝试在javascript中实现一个简单的泛洪填充类型算法。基本上我有一个3x3板，我代表一维数组。我想为每个“触摸”一个单独数组的相等值追加索引。例如，这个董事会：

[1] [1] [0]
[3] [1] [3]
[0] [0] [0]

将表示为一维数组，即[1,1,0,3,1,3,0,0,0]。在其中一个[1]上运行floodFill后，会产生一个看起来像这个[4,1,0]的数组，因为这些是1d数组中接触的索引，它们具有相同的值。

以下是代码：

var boardArray = new Array(1,1,0,3,1,3,0,0,0);
var comboArray = new Array();
function floodFill(n, diceVal) {
    if(boardArray[n] != diceVal) {
        return;
    }
    comboArray.push(n);

    if (n >0 && n < 8) {
    // right
    if(!(n%3==2)) {
        floodFill(n+1, diceVal);
    }

    // left
    if(!(n%3==0)) {
        floodFill(n-1, diceVal);
    }

    // up
    if(n>2) {
        floodFill(n-3, diceVal);
    }

    // down
    if(n<5) {
        floodFill(n+3, diceVal);
    }
    } else {
        return;
    }
}
floodFill(4,1);

有谁能告诉我为什么这会陷入无限循环？

Answer 1

在“up”情况下，第一次通过时，您会拨打floodFill(1,1);。该电话会在“向下”的情况下拨打floodFill(4,1);，即可拨打floodFill(1,1)

你已经跟踪了匹配的方块 - 唯一真正会造成麻烦的方块。只需确认您没有再次检查相同的方格：

function floodFill(n, diceVal) {
  if(boardArray[n] != diceVal) {
    return;
  }

  // have we been here before?
  if (comboArray.indexOf(n) >= 0)
    return;

  comboArray.push(n);

  // ...
}