javascript 扫雷器 floodfill 算法无法正常工作

Question

我正在尝试编写我的第一个简单的扫雷游戏。为了显示空白字段，我编写了一个简单的洪水填充算法，但它没有按预期工作。这是一段代码:

function reveal(a,b){
var fieldId = getFieldId(a,b);  

/*
cells are stored in array fields[]. Each cell is an object {x: x,y: y, hasBomb: boolean,
hasBeenDiscovered: boolean}. Function getFieldId returns array key for (x,y) cell.
*/

if(a < 0 || a > boardWidth-1){return}
if(b < 0 || b > boardHeight-1){return}

if(fields[fieldId].hasBeenDiscovered == true){return}

if(getNeighbourNumber(a,b) > 0){
    document.getElementById(a+'x'+b).innerHTML = getNeighbourNumber(a,b);
    document.getElementById(a+'x'+b).style.backgroundColor = 'white';
    document.getElementById(a+'x'+b).setAttribute('discovered',1);
    fields[fieldId].hasBeenDiscovered = true;
    return
}else if(getNeighbourNumber(a,b) == 0){
    document.getElementById(a+'x'+b).innerHTML = ' ';
    document.getElementById(a+'x'+b).style.backgroundColor = 'white';
    document.getElementById(a+'x'+b).setAttribute('discovered',1);  
    fields[fieldId].hasBeenDiscovered = true;


}

    reveal(a,b);
    console.log('0 ' + '0');
    reveal(a+1,b);
    console.log('+1' + ' ' + '0');
    reveal(a-1,b);
    console.log('-1 ' + '0');
    reveal(a,b+1);
    console.log('0 ' + '+1');
    reveal(a,b-1);
    console.log('0 ' + '-1');
    reveal(a-1,b-1);
    console.log('-1 ' + '-1');
    reveal(a-1,b+1);
    console.log('-1 ' + '+1');
    reveal(a+1,b+1);
    console.log('+1 ' + '+1');
    reveal(a+1,b-1);
    console.log('+1 ' + '-1');
    console.log('------------');

}

当发现北、西北和西邻居有邻居炸弹的空单元格时，floodfill 只会显示这些单元格，即使其他邻居(南、东南、西、东、东北)是空的。我是初学者编码员，我不明白为什么这段代码不能完全正常工作。任何帮助将不胜感激:)

编辑:控制台日志仅用于调试尝试。

Answer 1

我很高兴地说您编写了很棒的代码，阅读和理解代码非常容易。

你只需要检查 revealField 函数中的一件小事，这里你需要记住的一件事是，当你从属性中获取值时，它总是会以字符串形式提供给你，所以你需要使用十进制基数。

function revealField(){
    var x = this.getAttribute('x');
    var y = this.getAttribute('y');
    x = parseInt(x, 10);
    y = parseInt(y, 10);

    var fieldId = getFieldId(x,y);

    if(fields[fieldId].hasBomb == true){
        document.getElementById(x+'x'+y).innerHTML = 'B';
        this.style.backgroundColor = 'brown';
        this.setAttribute('hasBomb', 1);
        removeEvents();
        alert('Bomba! Przegrales!');
    }else{
        this.style.backgroundColor = 'white';
        this.setAttribute('discovered',1);
        reveal(x,y);
        if(validateVictory() == true){
            removeEvents();
            alert('Brawo! Odkryles wszystkie bomby!');          
        }   
    }
}

这是您更新的 fiddle还有