我如何检查是否选择了井字游戏中的单元格

Question

我正在用机器人玩井字游戏，需要检查单元格是否为空。我确实让机器人工作了，因为它在黑板上写了一个随机的 X，但机器人在 Os 上写了 Xs。所以我需要弄清楚如何检查一个单元格是否包含 Xs 或 Os 如果没有则放置 X。现在我的代码是这样的。

const cellElement = document.querySelectorAll('[data-cell]')
const winner = document.getElementById("winner")
let nextTurn = false
let winningConditions = [
    [0, 1, 2],
    [3, 4, 5],
    [6, 7, 8],
    [0, 3, 6],
    [1, 4, 7],
    [2, 5, 8],
    [0, 4, 8],
    [2, 4, 6],
]

cellElement.forEach(cell => {
    cell.addEventListener("click", handleClick, { once: true })

    function handleClick() {
        playerTurn(cell)
        checkWin()
        computerTurn()
        //check for draw
    }
});

function playerTurn(cell) {
    if (nextTurn == false) {
        cell.innerHTML = "O"
        nextTurn = true
    }
}

function computerTurn() {
    if (nextTurn == true) {
        cellElement[Math.floor(Math.random() * cellElement.length)].innerHTML = "X"
        nextTurn = false
    } 
}

function checkWin() {
    for (let winCondition of winningConditions) {
        if (winCondition.every(i => cellElement[i].innerHTML == "X")) {
            winner.innerHTML = "X WON!!!"
        } else if (winCondition.every(i => cellElement[i].innerHTML == "O")) {
            winner.innerHTML = "O WON!!!"
        }
    }
}

我试过的是这个，但它只是将 x 放在第一个单元格中，然后向前移动 1 个单元格，但即使那里有一个 O，它也只是覆盖了 is。

function computerTurn() {
    for (let i = 0; i < cellElement.length; i++) {
        console.log(cellElement[i]);
        if (nextTurn == true) {
            if (cellElement[i].innerHTML !== "X" && "O") {
                cellElement[i].innerHTML = "X"
                nextTurn = false
                break;
            }
        } else {
            computerTurn()
        }
    }
}

你可以在这里测试代码https://jsfiddle.net/tv01cy7x/3/

Answer 1

你做不到

if (cellElement[i].innerHTML !== "X" && "O") {
                cellElement[i].innerHTML = "X"

但是

const val = cellElement[i].innerHTML
if ( val !== "X" && val !== "O")

在if中，每个条件都是独立评估的，所以当你放一个&&时，你仍然需要告诉他要比较哪个变量

换句话说：if ( val !== "X" && "O") 等同于 if ( "O" && val !== "X")，因为任何不为 null 或 0 或 undefined 的东西都等于 True，因此等同于：if ( val !== "X" && true ) 等同于 if ( val !== "X" )

要找到随机 X 的位置，您可以做的是：

function computerTurn(){
  r = Math.floor(Math.random() * cellElement.length);
  if (cellElement[i].innerHTML !== "X" && "O") {
    cellElement[i].innerHTML = "X";
    return 1;
  }
  return computerTurn();
}

我如何检查是否选择了井字游戏中的单元格

how do i check if a cell in tic tac toe is chosen or not

javascript

arrays

performance