如何实现井字棋玩家落子数组与获胜组合数组匹配判断？

问题根源 #

JavaScript里数组属于引用类型，===运算符只会判断两个数组是否是内存中的同一个引用，而不会对比数组内容是否一致。你直接用===对比玩家的playerHits数组和获胜组合数组，自然永远不会匹配。

解决思路 #

不用直接对比数组，而是检查玩家的playerHits数组是否包含某一组获胜组合的全部元素——毕竟只要玩家占满任意一条获胜路径的三个位置，就算赢了。

具体实现代码 #

1. 先定义所有获胜组合（和你现有markersToHit一致）：

const markersToHit = [
  [0,1,2], [3,4,5], [6,7,8], // 横向
  [0,3,6], [1,4,7], [2,5,8], // 纵向
  [0,4,8], [2,4,6] // 斜向
];

2. 写一个检查获胜的工具函数：

function checkWin(playerHits) {
  // 遍历每一组获胜组合
  return markersToHit.some(combination => {
    // 检查当前组合的所有元素是否都在玩家的已点击数组里
    return combination.every(num => playerHits.includes(num));
  });
}

3. 在点击事件里调用这个函数：

// 玩家点击按钮时，先把data-number转成数字存入playerHits
const clickedNum = parseInt(event.target.dataset.number);
activePlayer.playerHits.push(clickedNum);

// 检查是否获胜
if (checkWin(activePlayer.playerHits)) {
  // 触发获胜提示，比如弹窗或页面提示
  alert(`玩家${activePlayer === player1 ? '1' : '2'}赢了！`);
  // 这里可以加游戏重置、禁用按钮等后续逻辑
}

关键注意事项 #

• 确保playerHits里存的是数字类型：因为dataset.number返回的是字符串，一定要用parseInt转成数字，不然includes会因为类型不匹配判断错误。
• 不需要关心playerHits里元素的顺序，只要包含获胜组合的全部三个元素就行，完全符合井字棋的获胜规则。

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