Javascript - Tic Tac Toe - 如何循环通过 Win 条件？答案

【问题标题】：Javascript - Tic Tac Toe - How to loop through Win Condition?Javascript - Tic Tac Toe - 如何循环通过 Win 条件？
【发布时间】：2018-01-23 23:54:11
【问题描述】：

我正在编写一个正常运行的井字游戏程序，我已经完成了。除了我的获胜条件太长太丑。看起来像这样。

function checkWin(){
  if(board[0].textContent === "X" &&
    board[1].textContent === "X" &&
    board[2].textContent === "X"
  ) { alert("Win")}
  else if (
    board[3].textContent === "X" &&
    board[4].textContent === "X" &&
    board[5].textContent === "X"
  ) { alert("Win")}
   else if (
    board[6].textContent === "X" &&
    board[7].textContent === "X" &&
    board[8].textContent === "X"
  ) { alert("Win")}

}

我只写了几个获胜条件，因为如果我写完整的话，它会更长。我想知道如何编写更短的版本。我正在考虑做一个数组并循环遍历它，但我不知道怎么做。会是这样的。

var winConditions = [[0,1,2], [3,4,5], [6,7,8], [0,3,6], [1,4,7], [2, 5,8], [0,4,8], [6,4,2]]

但是如何使用 checkWin 循环遍历 winConditions 并使其等于 X 和 O？

【问题讨论】：

这不是一个容易解决的问题。除非您使用现有算法之一，否则它可能会变得混乱。上次我编写 TTT 游戏时，我检查了玩家的任何棋子是否形成了一条与棋盘一样长的直线。查找解决此问题的现有算法，除非您想以艰难的方式解决。
stackoverflow.com/questions/1056316/…
当然还有stackoverflow.com/questions/18548265/…

标签： javascript arrays algorithm loops for-loop

【解决方案1】：

使用 ES6

function checkWin(player){
  // player = 'X' or 'O'

  const horizontal = [0,3,6].map(i=>{return[i,i+1,i+2]});
  const vertical = [0,1,2].map(i=>{return[i,i+3,i+6]});
  const diagonal = [[0,4,8],[2,4,6]];

  var allwins = [].concat(horizontal).concat(vertical).concat(diagonal);
  
  let res = allwins.some(indices => { 
  return board[indices[0]] == player && board[indices[1]] == player && board[indices[2]] == player})
  return res;
}
// O O O
// X X O
// X X O
var board=["X","X","O","X","X","O","O","O","O"];
console.log(checkWin("X"),"Expect: false"); // false
console.log(checkWin("O"),"Expect: true"); // true

// negative test case
var board = [];
console.log(checkWin("X"),"Expect: false"); // false

// wierd case of only 1 player
// X X X
var board = ["X","X","X"]
console.log(checkWin("X"),"Expect: true"); //true

【讨论】：

【解决方案2】：

做循环和求和。当然，这可以优化：

var winConditions = [ /* what you defined */ ];

function winTest(board, side) {
  for(var i = 0; i < winConditions.length; i++) { 
    var sum = 0;
    var w = winConditions[i];

    for(var b = 0; b < w.length; b++) {
      if(board[w[b]].textcontent === side) {
        sum++
      }
    }

    if(sum === 3) {
      return true;
    }
  }
  return false;
}

// then, call it :
var result = winTest(board, 'X');

【讨论】：

【解决方案3】：

在惰性版本中，您可以将它们连接成一个字符串并使用RegExp进行测试：

function checkWin()
{
    var str = ""
    for (var i = 0; i < 9; i++)
        str += board[i].textContent

    if (/(X...?)\1X|^(...)*XXX|^..X.X.X/.test(str))
        alert("Win")
}

【讨论】：