javascript - 检查数组的更好方法

Question

我正在玩一个井字游戏，但在如何简化一些检查方面确实遇到了瓶颈。您会在下方看到水平、垂直和对 Angular 线检查，以查看玩家是否获胜。

问题:我可以用什么来简化这个而不重复那么多代码？非常感谢任何正确方向的指导。

数组看起来像这样:

gridArray: [
    ['', '', ''],
    ['', '', ''],
    ['', '', ''],
  ]

playerTurn 变量只是在您玩游戏时从 x 变为 o。

// Horizontal check
state.gridArray.map((item, index) => {
  if(
    item[0] === playerTurn &&
    item[1] === playerTurn &&
    item[2] === playerTurn) {
    console.log(playerTurn + ' has won!');
  }
});



// Vertical check
if(
  state.gridArray[0][0] === playerTurn &&
  state.gridArray[1][0] === playerTurn &&
  state.gridArray[2][0] === playerTurn
) {
  console.log(playerTurn + ' has won!');
}

if(
  state.gridArray[0][1] === playerTurn &&
  state.gridArray[1][1] === playerTurn &&
  state.gridArray[2][1] === playerTurn
) {
  console.log(playerTurn + ' has won!');
}

if(
  state.gridArray[0][2] === playerTurn &&
  state.gridArray[1][2] === playerTurn &&
  state.gridArray[2][2] === playerTurn
) {
  console.log(playerTurn + ' has won!');
}



// Diagonal check
if(
  state.gridArray[0][0] === playerTurn &&
  state.gridArray[1][1] === playerTurn &&
  state.gridArray[2][2] === playerTurn
) {
  console.log(playerTurn + ' has won!');
}

if(
  state.gridArray[0][2] === playerTurn &&
  state.gridArray[1][1] === playerTurn &&
  state.gridArray[2][0] === playerTurn
) {
  console.log(playerTurn + ' has won!');
}
}

谢谢!

Answer 1

您可以使用稍微不同的数据结构，只有一维和数字内容。然后，您可以定义另一个变量，列出该结构中代表获胜的所有三元组索引。通过该设置，检测获胜的函数几乎变成了一行代码:

var gridArray = [
    0, 0, 0,
    0, 0, 0,
    0, 0, 0,
]; 

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

function hasWon(gridArray, lines, playerTurn) {
    return lines.some(line => line.every(cell => gridArray[cell] === playerTurn));
}

注意:网格中的数值对于“X”将变为 1，对于“O”将变为 2。使用字符串 display = [' ', 'X', 'O'] 很容易将一个字符串转换为另一个字符串。

备选

如果你真的想获得高效的代码，你可以恢复到位操作，并用两个整数表示网格，一个用于“X”位置，一个用于“O”位置。您将使用每个整数的 9 位。使用相同的原则，您可以定义构成胜利的所有位掩码，并用它们执行 & 以查看是否匹配。

var gridArray = [0b000000000, 0b000000000]; // X bits, O bits

var lines = [
    0b111000000,
    0b000111000,
    0b000000111,
    0b100100100,
    0b010010010,
    0b001001001,
    0b100010001,
    0b001010100
];

function hasWon(gridArray, lines, playerTurn) {
    return lines.some(line => (line & gridArray[playerTurn]) == line);
}