I'm totally new at Javascript. I just learned about the WHILE loop and I'm trying to create a simple number guessing game, but it doesn't seem to be working. The program is supposed to work like this: The player has 3 tries to guess the random number from 1-5. If guessed wrong, an alert gives a hint whether or not the number is higher or lower. If guessed right, the program congratulates the player and exits the loop. The condition " ( guessCounter < 3 || +guess !== randomNumber ) " doesn't seem to be working though. Perhaps it's something else. Any help understanding why it's not working is appreciated. Thanks.
// Generate random number
const randomNumber = Math.floor( Math.random() * 5 ) + 1;
// Ask user for guess
let guess = prompt( "Guess a number between 1-5." );
// Create guessCounter
let guessCounter = 1;
// Allow only 3 guesses. Each wrong guess will hint if the random number is higher or lower. If guessed correctly, congratulate player and exit loop.
while ( guessCounter < 3 || +guess !== randomNumber ) {
if ( +guess < randomNumber ) {
alert(`You did not guess correctly. The number is higher.`);
guessCounter+= 1;
guess = prompt("Try again.");
} else if ( +guess > randomNumber ) {
alert(`You did not guess correctly. The number is lower.`);
guessCounter+= 1;
guess = prompt("Try again.");
} else {
alert(`You guessed the correct number. Congrats.`);
}
};
// Generate random number
const randomNumber = Math.floor(Math.random() * 5) + 1;
// Ask user for guess
let guess = prompt("Guess a number between 1-5.");
// Create guessCounter
let guessCounter = 1;
// Allow only 3 guesses. Each wrong guess will hint if the random number is higher or lower. If guessed correctly, congratulate player and exit loop.
while (guessCounter < 3) {
if (guess < randomNumber) {
alert(`You did not guess correctly. The number is higher.`);
++guessCounter;
guess = prompt("Try again.");
} else if (guess > randomNumber) {
alert(`You did not guess correctly. The number is lower.`);
++guessCounter;
guess = prompt("Try again.");
} else {
guessCounter = 3;
}
}
if (+guess === randomNumber) alert(`You guessed the correct number. Congrats.`);
else alert(`You did not guess the correct number.`);
Ok let's see how we can debug this code.
First we need to get rid of any randomness because debugging is much easier when dealing with predictable or constant values:
// Generate random number
const randomNumber = 4;
Ok so we know the correct random number in our debugging session will always be 4.
Let's enter the correct number in the first run:
Observed behaviour:
You guessed the correct number. Congrats.You guessed the correct number. Congrats.Yikes, this looks like an infinite loop. Why is that?
Let's have a closer look at the expression that ultimately decides whether the loop continues or not:
while ( guessCounter < 3 || +guess !== randomNumber ) {
We can evaluate those conditions by hand because we know:
1.) guessCounter is initialized to 1 and
2.) guess is "4", meaning +guess is 4 and randomNumber is fixed at 4.
Next we fill in the values:
while ( 1 < 3 || 4 !== 4 ) {
1 < 3 gives us true and 4 !== 4 also gives us true hence we have:
while ( true || true ) {
Repeating the same for the second "attempt":
1.) guessCounter is 2
2.) guess is "4", meaning +guess is 4 and randomNumber is fixed at 4.
Gives us:
while ( 2 < 3 || 4 !== 4 ) {
Which is equivalent to:
while ( true || true ) {
So we can already point out that the logic is not working according to our expectations.
We know that the loop should not continue yet it does.¹
I hope this gives you a starting point on how to debug and fix your code.
¹ If you're wondering if you can "break" out a running loop, yes you can: see break for that.