Javascript 为什么这个递归函数给我一个；超过最大调用堆栈大小；错误？

我正在使用HTML画布创建一个绘画应用程序，我正在尝试实现一个“绘画桶”工具，该工具将检测任何与单击的像素颜色相同的相邻像素，并用新颜色填充它

我得到一个“Uncaught RangeError:超出了最大调用堆栈大小”，但我无法找出我的逻辑出了什么问题：

function fillTool(){
    theCanvas.mousedown(function(e){
        var baseColor = paintUtilities.getPixelColor(e.offsetX, e.offsetY);
        context.fillStyle = color;
        fillNeighbors(e.offsetX, e.offsetY, baseColor);
    });
}

function fillNeighbors(x, y, baseColor) {
    context.fillRect(x, y, 1, 1);
    if (x > 0 && paintUtilities.getPixelColor(x - 1, y) === baseColor) {
        fillNeighbors(x - 1, y, baseColor);
    }
    if (y > 0 && paintUtilities.getPixelColor(x, y - 1) === baseColor) {
        fillNeighbors(x, y - 1, baseColor);
    }
    if (x < theCanvas.attr("width") - 1 && paintUtilities.getPixelColor(x + 1, y) === baseColor) {
        fillNeighbors(x + 1, y, baseColor);
    }   
    if (y < theCanvas.attr("height") - 1 && paintUtilities.getPixelColor(x, y + 1) === baseColor) {
        fillNeighbors(x, y + 1, baseColor);
    }   

}

函数fillTool（）{
鼠标向下移动（函数（e）{
var baseColor=paintUtilities.getPixelColor（e.offsetX，e.offsetY）；
context.fillStyle=颜色；
填充邻域（e.offsetX、e.offsetY、baseColor）；
});
}
函数（x、y、基色）{
fillRect（x，y，1，1）；
if（x>0&&paintUtilities.getPixelColor（x-1，y）==baseColor）{
填充邻域（x-1，y，基色）；
}
如果（y>0&&paintUtilities.getPixelColor（x，y-1）==baseColor）{
填充邻域（x，y-1，基色）；
}
如果（x

因为它是一个递归函数，在每个if语句中，您都会一次又一次地调用它。。。该函数没有基本情况。

事实上，再看一眼，我发现了代码的问题，它确实有无限递归

---

假设从x=1开始，x可以从0到2。首先向左走，递归调用函数。该功能最终将转到右侧！然后，这个循环将永远重复。您需要跟踪您访问过的位置，或者向递归函数传递一个不继续的方向，或者沿着这些路线进行一些操作。

显然

fillneights

调用自己的次数太多了。因此，您的一个条件可能不正确，添加一些

console.log

语句，您会找到它。因为在某个点上，您最终会得到

x

等于

宽度

——一个不存在的坐标

x

应仅允许上升到

width-1

。同样的

y

和

height

。有什么解释吗？换句话说，我的逻辑没有“错误”，但如果我单独填充每个像素，我的浏览器仍然无法处理这么多函数调用。如果不是逐像素实现这个工具，还有其他想法吗？@Noam有一些基本上构建自己的堆栈的想法。你确定这个说法吗？我已经实现了很多次类似的递归函数，但没有得到这个错误。看起来是这样，但我没有代码来检查它。你有其他解决方案吗？@NiettheDarkAbsolExcept它还进行颜色检查-如果已经绘制了新位置，它不会递归到新位置。首先，如果baseColor和fillColor相同，它会

console.log（x）

可能会告诉您，无论出于何种原因，这种情况已经发生，即使它们不同。@HamzaKubba，我相信Pointy是正确的。在baseColor和fillColor相同的情况下，我会有一个条件，即不会开始颜色填充with@Noam也许

getPixelColor

无法提供与填充颜色精确匹配的

=

，原因可能包括舍入或抗锯齿？你试过记录一些值吗？