JavaScript问题：无法终止井字棋主函数game()及实现平局逻辑

Hey there! Let's tackle your Tic-Tac-Toe issues step by step—you're already crushing it getting basic gameplay working, so let's build on that.

Fix 1: Terminate the game() function after a win #

In JavaScript, the simplest way to stop a function mid-execution is with the return statement. You’ll want to add this right after you detect a win, so no further game logic runs.

Even better, using a game state variable (like gameActive) will prevent players from making moves after the game ends, which is more user-friendly than just terminating the function. Here’s how to integrate that:

function game() {
  let board = ['', '', '', '', '', '', '', '', ''];
  let currentPlayer = 'X';
  let gameActive = true; // Tracks if the game is still playable

  // Your existing cell click handler (adjust to match your code)
  function handleCellClick(cellIndex) {
    // Exit early if the cell is taken or game is over
    if (board[cellIndex] !== '' || !gameActive) return;

    // Place the player's mark
    board[cellIndex] = currentPlayer;
    renderBoard(); // Assume this updates your UI

    // Check for a win
    if (checkWin(currentPlayer)) {
      alert(`Player ${currentPlayer} won!`);
      gameActive = false; // Lock the game
      return; // Stop executing this function immediately
    }

    // We'll add draw check here next...

    // Switch players only if game is still active
    currentPlayer = currentPlayer === 'X' ? 'O' : 'X';
  }

  // Your existing win check function (adjust if needed)
  function checkWin(player) {
    const winPatterns = [
      [0,1,2], [3,4,5], [6,7,8], // Rows
      [0,3,6], [1,4,7], [2,5,8], // Columns
      [0,4,8], [2,4,6] // Diagonals
    ];
    return winPatterns.some(pattern => {
      return pattern.every(index => board[index] === player);
    });
  }

  // ... rest of your game setup (event listeners, etc.)
}

Fix 2: Add Draw Logic #

A draw happens when every cell is filled, but neither player has won. We’ll add a checkDraw() function that verifies both conditions:

function checkDraw() {
  // First, make sure no one has already won (to avoid false draws)
  if (checkWin('X') || checkWin('O')) return false;
  // Check if every cell is occupied
  return board.every(cell => cell !== '');
}

Now insert this check right after the win check in handleCellClick:

// After win check...
if (checkDraw()) {
  alert("It's a draw!");
  gameActive = false;
  return; // Terminate the function here too
}

Quick Recap #

• Terminating the game: Use return to stop the current function flow, and the gameActive variable to block future moves.
• Draw detection: Confirm the board is full and no winner exists before triggering a draw alert.

This setup will lock the game as soon as someone wins or it’s a draw, and prevent any unintended后续操作 (like switching players after a win).

内容的提问来源于stack exchange，提问作者devHolmes