Javascript if-else解释

Question

This little program is supposed to have the browser guess at what the user inputs. It's "how many fingers". So i want it to force the user to use a number 5 or less.

If the input is larger than the range of options available to the program, the program will error out and break the browser. I've tried rearranging the nesting of the scripts in various ways to get a feel for how JS "thinks". Unfortunately, I still don't have a grasp of how Javascript is interpreting the flow of the code.

I use SQL at work and am familiar with the logic of PEMDAS in math. I think this is a similar situation where i'm missing something about the logical implications of the syntax. It seems to me like this is a very straightforward program.

I don't understand why the program doesn't execute the alert when my input meets the criteria for executing the IF clause. It works fine on the Else clause.

 document.getElementById("guess").onclick = function() { var a = document.getElementById("myNumber").value; var b = 6; var x = Math.random(); x = x * b; x = Math.floor(x); if (a > b) { alert("you don't have that many fingers"); } else { var gotit = false; var guesses = 1; while (gotit == false) { if (a == x) { gotit = true; alert("Success! the answer is" + x + " or " + a + " it took me " + guesses + " guesses!"); } else { guesses++; var x = Math.random(); x = x * b; x = Math.floor(x); } } } } 

 <p>How many fingers are you holding up?</p> <input id="myNumber" /> <button id="guess">Guess!</button> 

All help is greatly appreciated.

Answer 1

You need to change the test to if (a >= b) . The code guesses numbers from 0 to 5 , so if the user enters 6 it will never match. But a > b only succeeds when they enter 7 or higher -- 6 is not greater than b .

 document.getElementById("guess").onclick = function() { var a = document.getElementById("myNumber").value; var b = 6; var x = Math.random(); x = x * b; x = Math.floor(x); if (a >= b) { alert("you don't have that many fingers"); } else { var gotit = false; var guesses = 1; while (gotit == false) { if (a == x) { gotit = true; alert("Success! the answer is " + x + " or " + a + " it took me " + guesses + " guesses!"); } else { guesses++; var x = Math.random(); x = x * b; x = Math.floor(x); } } } } 

 <p>How many fingers are you holding up?</p> <input id="myNumber" /> <button id="guess">Guess!</button> 

Answer 2

First off, you're repeating your random generation, so I'd break that out to a function. Second, your logic is wrong (has a chance of the guess being 0 fingers as well as a very small chance of it being 6 fingers).

What Math.random actually does is returns a value between 0 and 1 , so I think you can see the logic error there (0 to 1)*6 = possibly 0 or 6 .

So if you start off with a function for the calculation

  function getRandomFinger(amountOfFingers) {
    var x = Math.random();
    x = (x * (amountOfFingers-1))+1; // ((0 to 1)*4)+1 because always at least one finger but possibly 4 more
    return Math.round(x);
  }

and you can call that when needed. And then actually defining the amount of fingers makes more sense right? More than some seemingly random number.

  var b = 5; // 5 fingers on the hand

Add those few changes and your code should work.