在我的猜数字游戏中遇到 while 循环问题

Question

所以，我无法启动 while 或 for 循环来创建从 6 开始的轮数，以允许猜数字的用户在他输掉之前只有 6 个轮次，并给出一条消息，说明他输了应该猜到的数字。每次他在文本框中输入猜测时，转数将一个一个倒数到 0。我对在哪里创建 while 循环以及在哪里放置 while 循环感到困惑。是否有多种方法可以创建此操作？

谢谢！

    //creating the guessing game function using if and else if statements
var guessGame = function(){
    var guess = document.getElementById("guessTextbox").value;
    var guessOutput = document.getElementById("gameStatus");

    //if guessed number is equal to the random number, winning display message is shown
    if (guess == guessNum){
        guessOutput.value = guessOutput.value + "You've guessed correctly! The correct number was: " + guessNum;
    }
    //else if statement for guesses not in the 1-100 range displaying error/incorrect message
    else if (guess > 100 || guess < 1){
        guessOutput.value = guessOutput.value + "Incorrect number range!";
    }
    else if (guess > guessNum){
        guessOutput.value = guessOutput.value + "The guess is too high!";
    }
    else if (guess < guessNum){
        guessOutput.value = guessOutput.value + "The guess is too low!";
    }
    //else if guess is NOT a number, displays message
    else if (isNaN(guess)){
        guessOutput.value = guessOutput.value + "Input value is not a number!";
    }
};

Answer 1

这是实现该目标的一种方法。我留下了一些 cmets 来帮助您导航。如果我能澄清任何事情，请告诉我。

// When initialized, guessGame returns a function that allows
// 6 guesses and then reveals the random number.
function guessGame() {

    // Start with 6 turns.
    this.turns = 6;

    // Generate random number guessNum s.t. 1 < guessNum < 100
    this.guessNum = Math.floor(Math.random() * (100 - 2)) + 2;

    return function() {
      var guessOutput = document.getElementById("gameStatus");

      // If no turns left, output the message and return.
      if (this.turns === 0) {
        guessOutput.value = guessOutput.value + "You've ran out of turns! The correct number was: " + this.guessNum;
        return;
      }

      // Otherwise, match the next guess against guessNum.
      var guess = parseInt(document.getElementById("guessTextbox").value, 10);

      // If equal, display the winning message
      if (guess === this.guessNum){
          guessOutput.value = guessOutput.value + "You've guessed correctly! The correct number was: " + this.guessNum;
      }
      // If not in range, display error message
      // Advice: might want to move this before the equality check.
      else if (guess > 100 || guess < 1){
          guessOutput.value = guessOutput.value + "Incorrect number range!";
      }
      // If greater than, ...
      else if (guess > this.guessNum){
          guessOutput.value = guessOutput.value + "The guess is too high!";
      }
      // If less than, ...
      else if (guess < this.guessNum){
          guessOutput.value = guessOutput.value + "The guess is too low!";
          }
      // If not a number, display error.
      // Advice: might want to move this to the top of the checks.
      else if (isNaN(guess)){
          guessOutput.value = guessOutput.value + "Input value is not a number!";
      }

      // Decrement the number of turns.
      this.turns -= 1;

    // This helps the embedded function locate the random number.
    }.bind(this);
}

用法。

// Initialize the game
// (Suppose the random number is 30)
var game = new guessGame();

// Enter 21 in guessTextbox
game(); // => "The guess is too low!"

// Enter 22 in guessTextbox
game(); // => "The guess is too low!"

// Enter 23 in guessTextbox
game(); // => "The guess is too low!"

// Enter 24 in guessTextbox
game(); // => "The guess is too low!"

// Enter 50 in guessTextbox
game(); // => "The guess is too high!"

// Enter 49 in guessTextbox
game(); // => "The guess is too high!"

// Enter 48 in guessTextbox
game(); // => "You've ran out of turns! The correct number was: 30"

// Enter 47 in guessTextbox
game();  // => "You've ran out of turns! The correct number was: 30"

你明白了。

Answer 2

也许你应该把它放在你调用函数的地方，并在每次调用时降低猜测。并把你的信息告诉他他的猜测在循环之下。但我不知道你要在哪里称呼它。如果您在单击事件上调用它，则不需要循环。只需放一个 var guesses =5;例如在页面加载时并在你的函数中减少它。然后在函数结束时检查它是否为 0。

Answer 3

在这种情况下，while 循环充当您的游戏循环。非零数字评估为真，因此 while 循环将一直运行，直到guessesRemaining 等于假（在本例中为 0）。我没有因为猜测超出范围和非整数猜测而惩罚玩家，但如果这是你想要的，这是一个简单的改变。在这个例子中，为了简单起见，我让用户输入了一个 prompt()。附带说明一下，在测试正确答案之前，您通常会先检查有效值（即 NaN、null 等）。您可能还想对用户输入进行 parseInt()。

        //creating the guessing game function using if and else if statements
function guessGame(){
    var guessesRemaining = 6,
        guessNum = Math.floor(Math.random() * 100) + 1;
        guessOutput = document.getElementById("gameStatus");

    while(guessesRemaining){ // non-zero numbers are truthy
        var guess = prompt();
        //if guessed number is equal to the random number, winning display message is shown
        if (guess == guessNum){
            guessOutput.value = guessOutput.value + " You've guessed correctly! The correct number was: " + guessNum;
            guessesRemaining = 0; // No more guesses needed!!!
        }
        else if (isNaN(guess)){
            guessOutput.value = guessOutput.value + " Input value is not a number!";
            // decriment here if penalty for invalid guess is incurred
        }
        //else if statement for guesses not in the 1-100 range displaying error/incorrect message
        else if (guess > 100 || guess < 1){
            guessOutput.value = guessOutput.value + " Incorrect number range!";
            // decriment here if penalty for invalid guess is incurred
        }
        else if (guess > guessNum){
            guessOutput.value = guessOutput.value + " The guess is too high!";
            guessesRemaining--; // decriment remaining guesses
        }
        else if (guess < guessNum){
            guessOutput.value = guessOutput.value + " The guess is too low!";
            guessesRemaining--; // decriment remaining guesses
        }
    }
};

如果您需要澄清任何事情，请告诉我。