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

【问题标题】：Javascript flood fill algorithm getting caught in an infinite loopJavascript洪水填充算法陷入无限循环
【发布时间】：2014-08-03 02:22:29
【问题描述】：

您好，我正在尝试在 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);

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

【问题讨论】：

在你的“up”情况下，第一次通过，你会打电话给floodFill(1,1);。那个调用，在它“down”的情况下，会调用floodFill(4,1);，很快就会调用floodFill(1,1)...
提示：如果有一些数组可以让你看到你已经处理了哪些方块。哦，等等……
这就是我认为我应该做的：添加一个数组来跟踪已经调用了洪水填充的所有索引值，然后再调用洪水填充检查以查看索引是否已经用过，如果用过，返回。但是维基百科上的洪水填充算法没有提到这一点，这就是为什么我认为我做错了什么。
您已经在跟踪您的需求。你只需要检查它。请参阅下面的答案。
不看，如果维基百科上的洪水填充算法随着它的进行而更改为新颜色，则不会发生此问题。下次你打同一个方块时，它的颜色已经改变，不再匹配。

标签： javascript algorithm recursion flood-fill

【解决方案1】：

在您“升级”的情况下，第一次通过时，您将致电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);

  // ...
}

【讨论】：