trying to build a bingo game, while loop infinite, can't seem to find why

Question

I am trying to create a bingo game.

It's an assignment that was given to us. I wrote all the functions I need however the "main" function which runs the entire thing, it has a loop which doesn't stop. I don't seem to know what makes it infinite since I gave a condition for it to stop at the end.

The code is a bit long. I hope you can help me out.

var gNums = []

var gPlayers = [

  {
    name: 'player1',
    hitCounts: 0,
    board: creatBingoBoard()
  },
  {
    name: 'player2',
    hitCounts: 0,
    board: creatBingoBoard()
  }
]
// var check=gPlayers[0].board[0][0].isHit = true
// console.table(printBingoBoard(gPlayers[0].board))
// console.table(printBingoBoard(gPlayers[1].board))

// var check = gPlayers[0].board[0][0].isHit = true
playBingo()
// console.table(gPlayers[0].board)

function playBingo() {
  // debugger
  resetNums()
  var isVictory = false
  while (!isVictory) {
    // console.log('still running!')
    var calledNum = drawNum(gNums)
    // console.log(calledNum)

    for (var i = 0; !isVictory && i < gPlayers.length; i++) {
      var player = gPlayers[i]
      markBoard(player, calledNum)
      isVictory = checkBingo(player)
    }
  }
}

function creatBingoBoard() {
  resetNums()
  var board = [];
  const SIZE = 5;
  for (var i = 0; i < SIZE; i++) {
    board[i] = [];
    for (var j = 0; j < SIZE; j++) {
      board[i][j] = {
        value: getRandomIntInclusive(0, 25),
        isHit: false
      }
    }
  }
  return board;
}

function printBingoBoard(board) {
  var bingoBoardCopy = []
  var size = board.length
  for (var i = 0; i < size; i++) {
    bingoBoardCopy[i] = []
    for (var j = 0; j < size; j++) {
      if (board[i][j].isHit === true) {
        bingoBoardCopy[i][j] = board[i][j].value + 'v'
      } else bingoBoardCopy[i][j] = board[i][j].value
    }
  }
  return bingoBoardCopy
}

function resetNums() {
  gNums = []
  for (var i = 0; i < 25; i++) {
    gNums.push(i)
  }
  return gNums
}

function drawNum(nums) {
  var index = getRandomIntInclusive(0, nums.length);
  var num = nums[index];
  nums.splice(index, 1);

  return num;
}

function markBoard(player, calledNum) {
  for (var i = 0; i < player.board.length; i++) {
    for (var j = 0; j < player.board.length; j++) {
      var cell = player.board[i][j]
      if (cell === calledNum) {
        player.hitCounts++
          cell.isHit = true
      }
    }

  }
  printBingoBoard(player.board)
}

function checkBingo(player) {
  // for (var i = 0; i < player.length; i++) {
  // if (player.hitsCount === 25) return true
  if (player.hitCounts === 25) {
    return true
  }

  return false;
}

function getRandomIntInclusive(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min + 1)) + min; //The maximum is inclusive and the minimum is inclusive 
}

Answer 1

var gNums = []

var gPlayers = [

  {
    name: 'player1',
    hitCounts: 0,
    board: creatBingoBoard()
  },
  {
    name: 'player2',
    hitCounts: 0,
    board: creatBingoBoard()
  }
]
// var check=gPlayers[0].board[0][0].isHit = true
console.table(printBingoBoard(gPlayers[0].board))
console.table(printBingoBoard(gPlayers[1].board))

// var check = gPlayers[0].board[0][0].isHit = true
playBingo()
// console.table(gPlayers[0].board)

function playBingo() {
  // debugger
  resetNums()
  var isVictory = false
  while (!isVictory) {
    // console.log('still running!')
    var calledNum = drawNum();
   //<-- Fix 1 for some reason callednum is coming as Undefined
    if(calledNum){
        // console.log(calledNum)
        for (var i = 0; !isVictory && i < gPlayers.length; i++) {
          var player = gPlayers[i]
          markBoard(player, calledNum)
          isVictory = checkBingo(player)
        }
    }
    //<-- Fix 2 I am stopping fo gNums is empty 
    if(gNums.length == 0) isVictory=true;

  }
  console.table(printBingoBoard(gPlayers[0].board))
  console.table(printBingoBoard(gPlayers[1].board))
}

function creatBingoBoard() {
  resetNums()
  var board = [];
  const SIZE = 5;
  for (var i = 0; i < SIZE; i++) {
    board[i] = [];
    for (var j = 0; j < SIZE; j++) {
      board[i][j] = {
        value: getRandomIntInclusive(0, 25),
        isHit: false
      }
    }
  }
  return board;
}

function printBingoBoard(board) {
  var bingoBoardCopy = []
  var size = board.length
  for (var i = 0; i < size; i++) {
    bingoBoardCopy[i] = []
    for (var j = 0; j < size; j++) {
      if (board[i][j].isHit === true) {
        bingoBoardCopy[i][j] = board[i][j].value + 'v'
      } else bingoBoardCopy[i][j] = board[i][j].value
    }
  }
  return bingoBoardCopy
}

function resetNums() {
  gNums = []
  for (var i = 0; i < 25; i++) {
    gNums.push(i)
  }
  return gNums
}

function drawNum() {
  var index = getRandomIntInclusive(0, gNums.length);
  var num = gNums[index];
  gNums.splice(index, 1);

  return num;
}

function markBoard(player, calledNum) {
  for (var i = 0; i < player.board.length; i++) {
    for (var j = 0; j < player.board.length; j++) {
      var cell = player.board[i][j]
  //<-- Fix3 Cell is a object so we need to check with value 
      if (cell.value === calledNum) {
        player.hitCounts++
          cell.isHit = true
      }
    }

  }
  printBingoBoard(player.board)
}

function checkBingo(player) {
  // for (var i = 0; i < player.length; i++) {
  // if (player.hitsCount === 25) return true
  if (player.hitCounts === 25) {
    return true
  }

  return false;
}

function getRandomIntInclusive(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min + 1)) + min; //The maximum is inclusive and the minimum is inclusive 
}

Answer 2

Got it to work!

I tried not to mess with your code too much.

My changes are marked with // <- fix.

1. Just showing who's the winner :)
2. You never pushed 25.
3. Off-by-one.
4. You were comparing the drawn number with the cell, instead of the cell's value.

var gNums = []

var gPlayers = [

  {
    name: 'player1',
    hitCounts: 0,
    board: creatBingoBoard()
  },
  {
    name: 'player2',
    hitCounts: 0,
    board: creatBingoBoard()
  }
]
// var check=gPlayers[0].board[0][0].isHit = true
// console.table(printBingoBoard(gPlayers[0].board))
// console.table(printBingoBoard(gPlayers[1].board))

// var check = gPlayers[0].board[0][0].isHit = true
playBingo()
// console.table(gPlayers[0].board)

function playBingo() {
  // debugger
  resetNums()
  var isVictory = false
  let totalNumbersCalled = 0;
  while (!isVictory) {
    var calledNum = drawNum(gNums)
    console.log(++totalNumbersCalled, '->', calledNum);

    for (var i = 0; !isVictory && i < gPlayers.length; i++) {
      var player = gPlayers[i]
      markBoard(player, calledNum)
      isVictory = checkBingo(player)
    }
  }
  console.log('Player', i - 1, 'wins!'); // <- fix 1
}

function creatBingoBoard() {
  resetNums()
  var board = [];
  const SIZE = 5;
  for (var i = 0; i < SIZE; i++) {
    board[i] = [];
    for (var j = 0; j < SIZE; j++) {
      board[i][j] = {
        value: getRandomIntInclusive(0, 25),
        isHit: false
      }
    }
  }
  return board;
}

function printBingoBoard(board) {
  var bingoBoardCopy = []
  var size = board.length
  for (var i = 0; i < size; i++) {
    bingoBoardCopy[i] = []
    for (var j = 0; j < size; j++) {
      if (board[i][j].isHit === true) {
        bingoBoardCopy[i][j] = board[i][j].value + 'v'
      } else bingoBoardCopy[i][j] = board[i][j].value
    }
  }
  return bingoBoardCopy
}

function resetNums() {
  gNums = []
  for (var i = 0; i <= 25; i++) { // <- fix 2
    gNums.push(i)
  }
  return gNums
}

function drawNum(nums) {
  var index = getRandomIntInclusive(0, nums.length - 1); // <- fix 3
  var num = nums[index];
  nums.splice(index, 1);

  return num;
  ;
}

function markBoard(player, calledNum) {
  for (var i = 0; i < player.board.length; i++) {
    for (var j = 0; j < player.board.length; j++) {
      var cell = player.board[i][j]
      if (cell.value === calledNum) { // <- fix 4
        player.hitCounts++
          cell.isHit = true
      }
    }

  }
  printBingoBoard(player.board)
}

function checkBingo(player) {
  // for (var i = 0; i < player.length; i++) {
  // if (player.hitsCount === 25) return true
  if (player.hitCounts === 25) {
    return true
  }

  return false;
}

function getRandomIntInclusive(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  //The maximum is inclusive and the minimum is inclusive 
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

Answer 3

In markBoard, you check the value of player.board[i][j]. That's an object, yet you're comparing it to a number. The numeric value you're after appears to be player.board[i][j].value.

As others have stated in the comments, the best way to approach this type of problem is to use a debugger. Chrome Developer Tools allows you to attach breakpoints and inspect the value of your objects in code. However, logging the values of your variables is also a good debugging tool.