我的布尔人不工作吗？

Question

I am trying to make a "Battleship" like game. Most of my board is supposed to be "missed" tiles, and only a few are supposed to be tiles with submarines on them for a "hit". The problem is that whenever I run my program, I cannot tell if it is ignoring my bool or if it isn't understanding what I coded, because everything I click is a "hit".

var cellClick=function(clicked)
{
    var cell=clicked.target;

    if(! cell.isEmpty) return;

    if(cell.isSub=false)
        {

            cell.style.backgroundImage='url("missed.png")';
            cell.style.backgroundSize='constrain';


        }
    else
        {
            cell.style.backgroundImage='url("hit.png")';
            cell.style.backgroundSize='constrain';
            cell.exploded=true;

        }

    cell.isEmpty=false;
    console.log('click');

};

var waterCell=[[],[],[],[],[],[],[],[],[],[]];

for(var row=0;row<10;row++)
    {
        for(var column=0;column<10;column++)
            {
                waterCell[row][column]=document.createElement("div");
                waterCell[row][column].style.width='10%';
                waterCell[row][column].style.height='10%';
                waterCell[row][column].style.position='absolute';
                waterCell[row][column].style.left=(column*10)+'%';
                waterCell[row][column].style.top=(row*10)+'%';
                waterCell[row][column].style.backgroundImage='url("water_cell.jpg")';
                waterCell[row][column].style.backgroundSize='contain';
                gameBoard.appendChild(waterCell[row][column]);

                waterCell[row][column].row=row;
                waterCell[row][column].column=column;
                waterCell[row][column].isEmpty=true;
                waterCell[row][column].isSub=false;
                waterCell[row][column].exploded=false;


            }
    }
//trying to make random subs
for(var i=0;i<5;i++)
    {
        row=Math.round(Math.random()*10);
        column=Math.round(Math.random()*10);
        waterCell[row][column].isSub=true;
    }






gameBoard.addEventListener('click',cellClick,false);

Answer 1

Your code

if(cell.isSub=false) {

is assigning false to the property isSub of cell . The assignment's result is then tested by if , which is false . That's why the condition is never met and the else -branch is processed. Obviously, your intention was

if(cell.isSub==false) {

Maybe try swapping the branches of if statement and test for truthy value in cell.isSub instead making the code simpler:

if ( cell.isSub ) {
  // it's a hit
} else {
  // it's a miss
}

If you require to keep this order of branches testing for falsy values can be simplified as well by using negation operator:

if ( !cell.isSub ) {
  // it's a miss
} else {
  // it's a hit
}

One last tip: don't set custom properties of a DOM element as those perform poorly. Even worse, they are perfect soil for memory leakages when putting Javascript objects or functions. Thus, keep the two worlds - your Javascript and your HTML/DOM - as separated as possible and train yourself not to put additional data into Javascript-representations of objects managed in context of DOM. Use a separate description in pure Javascript (eg two-dimensional array) for tracking position of your subs and create a DOM representing that internal data set, only.