用 Javascript 创建一个猜数游戏 - 循环需要帮助答案

【问题标题】：Creating a Number Guessing Game in Javascript - Need Help on Loop用 Javascript 创建一个猜数游戏 - 循环需要帮助
【发布时间】：2015-04-27 08:43:48
【问题描述】：

到目前为止，我已经创建了一个基本的数字猜谜游戏，该数字目前设置为 50 用于测试目的。我想知道如何添加一个循环，以便用户可以再次猜测。我还想在屏幕上看到之前的猜测。所以它应该是这样的：

猜数字游戏！

猜测 #1 : 49 是 LOW

猜测 #2：51 高

猜测 #3：50 是正确的

对于循环，我知道我需要使用“while(!guessed)”之类的东西，但根本不知道如何实现它，我对此很陌生，任何帮助都会很棒！

var canvas;
canvas = openGraphics();

var max;
max = 100;

var numberToGuess;
numberToGuess = 50; // will become Math.floor( Math.random() * max ) + 1; later //
canvas.setFont("comic sans ms", "15px", Font.Bold);
canvas.drawString("Number Guessing Game!");

var guess;
guess = prompt( "Please input your first guess" );


if(guess > numberToGuess){
  var message1;
  message1 = " was HIGH";
  var messageanswer;
  messageanswer = "Guess #1 : " + guess + message1;
  canvas.drawString(messageanswer, 20,20);
}

if (guess < numberToGuess){
  var message2;
  message2 = " was LOW";
  var messageanswer2;
  messageanswer2 = "Guess #1 : " + guess + message2;
  canvas.drawString(messageanswer2, 20,20);
}

if (guess == numberToGuess){
  var message3;
  message3 = " was CORRECT";
  var messageanswer3;
  messageanswer3 = "Guess #1 : " + guess + message3;
  canvas.drawString(messageanswer3, 20,20);
}

canvas.paint();

【问题讨论】：

标签： javascript loops numbers

【解决方案1】：

你是对的，你需要使用一种while循环来不断地允许输入，直到猜到数字为止。

请记住，您需要使用dowhile 循环，因为您希望在代码运行之后检查条件，而不是之前。

这样的事情会起作用：

var guess;
var numberToGuess = 50;

do {
    // check previous guess and alert low/high message
    if ( guess ) {
        if ( guess > numberToGuess ) {
            alert( "Your guess was too high." );
        }
        else {
            alert( "Your guess was too low." );
        }
    }

    guess = prompt( "Please input your guess" );
} while ( guess != numberToGuess );

alert( "You guessed correctly!" );

显然，如果您愿意，您可以添加自己的计数器和消息，但这应该会让您走上正轨。

【讨论】：

这很好并且有效，但我不确定如何让它向用户显示他们的猜测是“太高”还是“太低”，以便他们下次可以有更好的猜测，我如何让它显示他们之前的猜测，然后再尝试一次（如果可能的话）
@JohnSmith 您只需要检查guess 变量是高于还是低于numberToGuess 变量。我已经用一个例子更新了我的答案。如果您仍然遇到问题，请尝试创建一个 jsFiddle，以便我们查看问题的实际效果。

【解决方案2】：

我认为在这种情况下最好的方法是像这样包装你的代码

function guess()
{
    if(guess > numberToGuess)
    {  }

    if (guess < numberToGuess)
    {   }

    if (guess == numberToGuess)
    {
        ...
        return;
    }
    else guess();
}

【讨论】：

最好在此处添加一个参数作为 nth-guess，他将需要它以在画布中呈现结果。

【解决方案3】：

JavaScript 中的循环存在一个问题：UI 在运行时死机。所以你需要开始思考“事件”和“事件处理程序”。

这个想法是更新 UI 或 DOM 以显示游戏的当前状态。 UI 的一部分是一个文本输入字段，用户可以在其中输入下一个猜测。接下来应该是一个按钮“我是对的吗？”。这两个元素替换了提示符。

您现在可以向按钮添加事件/单击处理程序。在处理程序中，您读取输入并检查它。如果错误，则更新 UI。

如果正确，则隐藏文本字段和按钮。相反，您会显示某种“您赢了！”屏幕加上一个重新开始游戏的按钮。

同样，代码应该以此结尾。 win 按钮的单击处理程序应将 UI 重置为原始状态。

【讨论】：