Bootcamp
Search…
1.POCE.5: Tic Tac Toe

Setup

Begin by forking this starter code repo: https://github.com/rocketacademy/tictactoe-bootcamp​

Base

Check Win

Add a checkWin function when the player clicks a square. When the game is won, display the winner on the screen and reset the game.
1
const checkWin = (board) => {
2
// check every position
3
// there is a conditional for all 15 win conditions
4
if (board[0][0] === board[0][1] && board[0][1] === board[0][2]) {
5
// XXX
6
}
7
​
8
if (board[0][0] === board[1][0] && board[1][0] === board[2][0]) {
9
// X
10
// X
11
// X
12
}
13
};
14
​
15
const squareClick = function (column, row) {
16
if (board[column][row] === '') {
17
board[column][row] = currentPlayer;
18
if (checkWin() === true) {
19
// game over
20
} else {
21
togglePlayer();
22
}
23
}
24
};
Copied!

Comfortable

Check for the win by advancing through the game board with two nested loops. You will need to be able to write a loop that moves vertically, horizontally, diagonally left to right and diagonally right to left across the board.
If we imagine that the board element indexes create coordinates, board[i][j] is like 0,0; What is a loop where the coordinate numbers change in the pattern we want? i.e., 0,0 -> 0,1 -> 0,2 moves across the top of the board horizontally.

More Comfortable

User Choice Board

Allow the user to enter the size of board they want.

User Choice Win

Allow the user to enter the number of squares in a row that makes a win.

Computer Player 1

Create a computer player that makes a random square choice to play.

Computer Player 2

Create a computer player that will make a random choice, unless the player is about to win, then blocks them.

Computer Player 3

Create a computer player that tries to win the game.

Reference Solution

Click here to see the reference solution for this post class.
Last modified 2mo ago