我如何跟踪玩家在游戏中的回合？

Question

我创建了一个游戏，它会在屏幕上显示得分最高的获胜者。玩家一号和二号有两个按钮。用户将玩游戏达到设定的分数。例如，如果游戏设置为5，则用户将点击两个按钮，直到按钮一或按钮二达到5的获胜分数。标题可以显示“恭喜玩家1获胜分数为5到4”。玩家应该不能一直点击一个按钮来达到 5 的获胜分数。但是，我如何跟踪玩家的回合？下面是代码：

score.html file:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>score</title>
    <link rel="stylesheet" href="score.css">
</head>
<body>
 <h1> <span id="p1Display" > <span id="player1Win"></span> 0</span> to <span id="p2Display">0</span></h1> 

 <p>Play to: <span>5</span> </p>

 <input type="number">
 <button id="p1">Player one</button>
 <button id="p2">Player two</button>
 <button id="reset">Reset</button>


    <script src="score.js"></script>
</body>
</html>

score.js file:

p1Button.addEventListener("click", function () {
    if (!gameOver) {
        if(turnTacker == 0) {
            turnTacker = 1;
            p1Score++;
        }else {
            turnTacker = 0;
            p2Score++;
        }

        if (p1Score === winningscore) {
            p1Display.classList.add("winner");
            gameOver = true; //stop adding to score
        }
        p1Display.textContent = p1Score;

        if (gameOver ) {
            p1Display.textContent = `congratulations Player 1 win score of ${p1Score}`; 
        }


    }
});

p2Button.addEventListener("click", function () {
   if (!gameOver) {
        if(turnTacker == 0) {
            turnTacker = 1;
            p2Score++;
        }else {
            turnTacker = 0;
            p1Score++;
        }

        if (p2Score === winningscore) {
            p2Display.classList.add("winner");
            gameOver = true; //stop adding to score
        }
        p2Display.textContent = p2Score;

        if (gameOver ) {
            p2Display.textContent = `congratulations Player 2 win score of ${p2Score}`; 
        }


    }
});


resetButton.addEventListener("click", function () {
    reset(); //function to start over
    p1Score = 0; //set player score back to 0
    p2Score = 0;
    //update score on html page to 0
    p1Display.textContent = 0;
    p2Display.textContent = 0;
    //remove winner class from both p1 &p2
    p1Display.classList.remove("winner");
    p2Display.classList.remove("winner");
    gameOver = false;

});


//start game over/reset to 0
function reset() {
    p1Score = 0; //set player score back to 0
    p2Score = 0;
    //update score on html page to 0
    p1Display.textContent = 0;
    p2Display.textContent = 0;
    //remove winner class from both p1 &p2
    p1Display.classList.remove("winner");
    p2Display.classList.remove("winner");
    gameOver = false;
}


numInput.addEventListener("change", function () {
   // winningscoreDisplay.textContent = numInput.value; //update winng score get value from text field
    winningscoreDisplay.textContent = this.value; //update winng score get value from text field
    winningscore = Number(this.value); //get and set value in textfield. Turn into number
    //winningscore = Number(numInput.value); //get and set value in textfield. Turn into number
    reset();//once input number run reset
});

Answer 1

对于两个玩家，您需要一个切换开关。这可以是页面 DOM 中隐藏字段的值，也可以只是一个 JS 变量，只要页面没有刷新。或者更进一步，您可以跟踪服务器的开启情况，但现在这听起来太高级了。

切换可以基于偶数/奇数计算，或仅基于 if 语句。类似：

    if(turn==0){turn=1}else{turn=0}

上面的行就像一个on/off 开关，是轮到off，玩家1 可以玩，他/她的动作会变成on。当开关为on时，player2可以播放，他/她的动作将再次将其转为off。

或者如果你有两个以上的玩家

    turn++; // before turn increase by 1 each time

    // do everything here for the current player

    if(turn >= countPlayers()){turn=0} // reset to 0 after the last player

在这个概念中，没有值 0，因为我们在第一回合之前用 ++ 从 1 开始，然后每次玩家做某事时增加回合，直到玩家总数已玩过，然后重置回 0。

如果您只有两个玩家，则偶数/奇数计算是切换的简单替代方案。由于您已经在跟踪所玩的总回合数，因此不需要额外的变量。

    function checkOdd(int){
      return int % 2;
    }

    if(checkOdd(turnTacker)){
      // player2 has to play
    }else{
      // player1 has to play
    };

如果turnTacker 是0 checkOdd 是FALSE，如果turnTacker 是1 checkOdd 是TRUE，如果turnTacker 是2 checkOdd 是@987

Answer 2

你应该做的是添加另一个变量来说明轮到谁了。 例如：

var p1turn = true;
while (i < //a certain number of turns) {
   if (p1turn) {
      //something player 1 does
      p1turn = false;
      i++;
   }
   else {
      //something player 2 does
      p1turn = true;
      i++;
   }
}

希望这会有所帮助！