如何基于二维数组实现井字棋（Tic Tac Toe）的胜负判定逻辑？

以下是适配你现有二维数组棋盘结构（0=空位、1=X、2=O）的胜负判定逻辑实现，包含获胜检测、平局判断以及完整的集成方案：

核心胜负判定函数 #

function checkWin(board) {
  // 检查所有行是否有赢家
  for (let row = 0; row < 3; row++) {
    if (board[row][0] !== 0 && board[row][0] === board[row][1] && board[row][1] === board[row][2]) {
      return board[row][0];
    }
  }

  // 检查所有列是否有赢家
  for (let col = 0; col < 3; col++) {
    if (board[0][col] !== 0 && board[0][col] === board[1][col] && board[1][col] === board[2][col]) {
      return board[0][col];
    }
  }

  // 检查两条对角线是否有赢家
  if (board[0][0] !== 0 && board[0][0] === board[1][1] && board[1][1] === board[2][2]) {
    return board[0][0];
  }
  if (board[0][2] !== 0 && board[0][2] === board[1][1] && board[1][1] === board[2][0]) {
    return board[0][2];
  }

  // 检查是否平局（棋盘无空位且无赢家）
  let isBoardFull = true;
  for (let row = 0; row < 3; row++) {
    for (let col = 0; col < 3; col++) {
      if (board[row][col] === 0) {
        isBoardFull = false;
        break;
      }
    }
    if (!isBoardFull) break;
  }
  return isBoardFull ? 'draw' : null;
}

集成到现有代码 #

修改你的tileclick函数，在每次落子后调用胜负判定逻辑，同时新增重复落子拦截和棋盘重置功能，完整JS代码如下：

let board = [
  [0, 0, 0],
  [0, 0, 0],
  [0, 0, 0]
];
//the team symbols
let teamcross = "x";
let teamcircle = "o";
//for the tileclick function
let x = 0;
let y = 0;
var tile = "test";
//1 is Team X and 2 is Team O
var currentteam = 1;

// 胜负判定函数
function checkWin(board) {
  // 检查所有行是否有赢家
  for (let row = 0; row < 3; row++) {
    if (board[row][0] !== 0 && board[row][0] === board[row][1] && board[row][1] === board[row][2]) {
      return board[row][0];
    }
  }

  // 检查所有列是否有赢家
  for (let col = 0; col < 3; col++) {
    if (board[0][col] !== 0 && board[0][col] === board[1][col] && board[1][col] === board[2][col]) {
      return board[0][col];
    }
  }

  // 检查两条对角线是否有赢家
  if (board[0][0] !== 0 && board[0][0] === board[1][1] && board[1][1] === board[2][2]) {
    return board[0][0];
  }
  if (board[0][2] !== 0 && board[0][2] === board[1][1] && board[1][1] === board[2][0]) {
    return board[0][2];
  }

  // 检查是否平局（棋盘无空位且无赢家）
  let isBoardFull = true;
  for (let row = 0; row < 3; row++) {
    for (let col = 0; col < 3; col++) {
      if (board[row][col] === 0) {
        isBoardFull = false;
        break;
      }
    }
    if (!isBoardFull) break;
  }
  return isBoardFull ? 'draw' : null;
}

// 棋盘重置函数
function resetBoard() {
  board = [
    [0, 0, 0],
    [0, 0, 0],
    [0, 0, 0]
  ];
  document.querySelectorAll('.tile').forEach(tile => {
    tile.innerHTML = "*";
  });
  currentteam = 1;
  document.getElementById("turndisplay").innerHTML = "current team is: X";
}

//the tileclick function
function tileclick(tile, y, x) {
  // 拦截重复落子操作
  if (board[y][x] !== 0) {
    window.alert("该位置已被占用，请选择其他格子");
    return;
  }

  switch (currentteam) {
    case 1:
      document.getElementById(tile).innerHTML = "x";
      board[y][x] = 1;
      currentteam = 2;
      document.getElementById("turndisplay").innerHTML = "current team is: O";
      break;
    case 2:
      document.getElementById(tile).innerHTML = "o";
      board[y][x] = 2;
      currentteam = 1;
      document.getElementById("turndisplay").innerHTML = "current team is: X";
      break;
    default:
      window.alert("something is broken. Current Team is " + currentteam);
      break;
  }

  // 落子后检测胜负
  const result = checkWin(board);
  if (result) {
    let message;
    if (result === 1) {
      message = "X队获胜！";
    } else if (result === 2) {
      message = "O队获胜！";
    } else if (result === 'draw') {
      message = "平局！";
    }
    window.alert(message);
    // 自动重置棋盘
    resetBoard();
  }
}

HTML部分保持不变 #

<table id='gameboard'>
  <tr id="toprow">
    <td class="tile" onclick="tileclick('tl',0,0)" id="tl">*</td>
    <td class="tile" onclick="tileclick('tc',0,1)" id="tc">*</td>
    <td class="tile" onclick="tileclick('tr',0,2)" id="tr">*</td>
  </tr>
  <tr id="middlerow">
    <td class="tile" onclick="tileclick('cl',1,0)" id="cl">*</td>
    <td class="tile" onclick="tileclick('cc',1,1)" id="cc">*</td>
    <td class="tile" onclick="tileclick('cr',1,2)" id="cr">*</td>
  </tr>
  <tr id="bottomrow">
    <td class="tile" onclick="tileclick('bl',2,0)" id="bl">*</td>
    <td class="tile" onclick="tileclick('bc',2,1)" id="bc">*</td>
    <td class="tile" onclick="tileclick('br',2,2)" id="br">*</td>
  </tr>
</table>

<h3 id="turndisplay">current team is: X</h3>

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