Algorithms Lesson 
%%js 

// ============================================================
// AP CSP: Developing Algorithms with Tic Tac Toe 🧩
// ============================================================
// Today you'll use algorithmic thinking to model a Tic Tac Toe game!
// We'll use a 2D array to represent the board and write algorithms
// that make moves and check for a winner.
// ============================================================


// -------------------------------
// Popcorn Hack 1: Initialize the 3x3 Board
// -------------------------------
// TODO: Create a 2D array that represents a 3x3 Tic Tac Toe board.
// Each space should start as "_".
// Example shape:
// [
//   ["_", "_", "_"],
//   ["_", "_", "_"],
//   ["_", "_", "_"]
// ]

let board = [
  ["_", "_", "_"],
  ["_", "_", "_"],
  ["_", "_", "_"]
];   // <-- fill in here
console.log("Starting board:");
for (let row of board) {
  console.log(row);
}


// -------------------------------
// Popcorn Hack 2: Make a Move
// -------------------------------
// TODO: Place an "X" in the center of the board (row 1, col 1).
// Then, place an "O" in the top-left corner (row 0, col 0).
// Use 2D indexing: board[row][col] = value

// board[...][...] = ... // <-- fill in here
// board[...][...] = ... // <-- fill in here

board[1][1] = "X";
board[0][0] = "O";

console.log("\nBoard after two moves:");
for (let row of board) {
  console.log(row);
}


// -------------------------------
// Popcorn Hack 3: Check for a Win
// -------------------------------
// TODO: Write an algorithm to check if either player ("X" or "O") has won.
// A player wins if:
//   ✅ Any row has all three of their symbols
//   ✅ Any column has all three of their symbols
//   ✅ Either diagonal has all three of their symbols
//
// The row and diagonal checks are given below.
// Your task: fill in the missing code for the COLUMN check section.

function checkWinner(board, player) {
  // --- Check rows ---
  for (let r = 0; r < 3; r++) {
    if (board[r][0] === player && board[r][1] === player && board[r][2] === player) {
      return true;
    }
  }
  for (let c = 0; c < 3; c++) {
    if (board[0][c] === player && board[1][c] === player && board[2][c] === player) {
      return true;
    }
  }
  if (board[0][0] === player && board[1][1] === player && board[2][2] === player) {
    return true;
  }

  return false;
}

board = [
  ["X", "O", "X"],
  ["O", "X", "_"],
  ["O", "_", "X"]
];

console.log("\nTesting winner algorithm:");
for (let row of board) {
  console.log(row);
}

if (checkWinner(board, "X")) {
  console.log("X wins!");
} else if (checkWinner(board, "O")) {
  console.log("O wins!");
} else {
  console.log("No winner yet.");
}

  // --- Check columns ---
  // TODO: Fill in this section!
  // Hint: Use a loop (for let c = 0; c < 3; c++) and check if
  // board[0][c], board[1][c], and board[2][c] are all equal to player.

  // for (let c = 0; c < 3; c++) {
  //   if (...) {
  //     return true;
  //   }
  // }

  // --- Check the first diagonal ---
  // if (board[0][0] === player && board[1][1] === player && board[2][2] === player) {
  //   return true;
  // }

  // --- Check the second diagonal ---
  // TODO: Fill in this section!
  // if (board[...][...] === player && board[...][...] === player && board[...][...] === player) {
  //   return true;
  // }

  // No winner found
  // return false;
// }


// Test your algorithm with a sample board!
board = [
  ["X", "O", "X"],
  ["O", "X", "_"],
  ["O", "_", "X"]
];

console.log("\nTesting winner algorithm:");
for (let row of board) {
  console.log(row);
}

// Check both players
if (checkWinner(board, "X")) {
  console.log("X wins!");
} else if (checkWinner(board, "O")) {
  console.log("O wins!");
} else {
  console.log("No winner yet.");
}


<IPython.core.display.Javascript object>

Console after running the code cell!

image.png