优化JavaScript井字棋游戏：实现平局检测的完整指南

function getWinner() {
  for (let i = 0; i < COMBOS.length; i++) {
    // 检查每个获胜组合
    // board[COMBOS[i][0]] + board[COMBOS[i][1]] + board[COMBOS[i][2]] 等于 3 或 -3 表示有玩家获胜
    if (Math.abs(board[COMBOS[i][0]] + board[COMBOS[i][1]] + board[COMBOS[i][2]]) === 3) {
      return board[COMBOS[i][0]]; // 返回获胜玩家的标记 (1 或 -1)
    }
    // 原始代码中的 board.includes(null) 是不准确的，因为空位用 0 表示
    // else if (board.includes(null)) {
    //   return null; // 游戏尚未结束
    // }
  }
  // 在这里直接 return 'T' 会导致问题
  // return 'T';
}

/*----- constants -----*/
const COLORS = { '0': 'white', '1': 'pink', '-1': 'lightgreen' };
const MARK = { '0': '', '1': 'X', '-1': 'O' };
const COMBOS = [
  [0, 1, 2], [3, 4, 5], [6, 7, 8],
  [6, 4, 2], [0, 4, 8], [0, 3, 6],
  [1, 4, 7], [2, 5, 8]
];

/*----- state variables -----*/
let board; // array of 9 boxes
let turn; // 1 or -1
let winner; // null = no winner; 1 or -1 winner; 'T' = Tie
let filledFields; // 新增：记录已填充的格子数量

/*----- cached elements  -----*/
const message = document.querySelector('h1');
const resetButton = document.querySelector('button');

/*----- event listeners -----*/
document.getElementById('board').addEventListener('click', handleClick);
resetButton.addEventListener('click', init);

/*----- functions -----*/
init();

// Initializes state and calls render()
function init() {
  board = [0, 0, 0, 0, 0, 0, 0, 0, 0];
  turn = 1;
  winner = null;
  filledFields = 0; // 初始化 filledFields
  render();
}

// Visualizes all state in the DOM
function render() {
  renderBoard();
  renderMessage();
}

// Iterate over the squares in the board
function renderBoard() {
  board.forEach(function(boardArr, boardIdx) {
    const squareId = `box-${boardIdx}`;
    const squareEl = document.getElementById(squareId);
    squareEl.style.backgroundColor = COLORS[boardArr];
    squareEl.innerHTML = MARK[boardArr];
    squareEl.style.display = 'flex';
    squareEl.style.justifyContent = 'center';
    squareEl.style.alignItems = 'center';
    squareEl.style.fontSize = '19vmin';
  });
}

// Display whose turn it is and the winner
function renderMessage() {
  if (winner === 'T') {
    message.innerHTML = 'Tie Game! Game Over!';
  } else if (winner) {
    message.innerHTML = `Player ${MARK[winner]} Wins!`;
  } else {
    message.innerHTML = `Player ${MARK[turn]}'s Turn`;
  }
}

// Get index of the clicked box
function handleClick(event) {
  const boxIdx = parseInt(event.target.id.replace('box-', ''));
  if (isNaN(boxIdx) || board[boxIdx] || winner)
    return;

  board[boxIdx] = turn;
  filledFields++; // 每次落子后增加计数器

  turn *= -1;
  winner = getWinner();
  render();
}

// Check for a winner or tie
function getWinner() {
  for (let i = 0; i < COMBOS.length; i++) {
    if (Math.abs(board[COMBOS[i][0]] + board[COMBOS[i][1]] + board[COMBOS[i][2]]) === 3) {
      return board[COMBOS[i][0]]; // 有赢家
    }
  }
  // 如果没有赢家，检查是否所有格子都已填满
  if (filledFields >= 9) { // 棋盘共有9个格子
    return 'T'; // 平局
  }
  return null; // 游戏仍在进行中
}