JavaScript/Exercises/GuessNumber

Guess a hidden number

The app chooses a random number and asks the user to guess it. The user has a limited number of attempts.

First, we need an HTML file plus CSS to realize the user interface. It shall contain:
 * A caption
 * A short description of the game
 * A text area to read the user's attempts plus a button to send the user's input to the app
 * Another text area where the app gives a response to the user, e.g.:
 * * The hidden number is smaller
 * * The hidden number is greater
 * * Bingo! That's the hidden number


 * A button to 'reset' the game
 * A button to unfold the random number


 * At this stage, the HTML doesn't contain any event definition or JavaScript.

The HTML might look like this:

Next, you develop the app's logic by adding events to buttons and functions within the  element.
 * To generate a random number you can use.
 * The HTML  element shall contain an   event whose event handler initializes the game. The same function is called when 'reset' is pressed.
 * To get access to the two text areas, they must have an  attribute.
 * Read from and write to the text areas via 'value':.

All in all, the app might look like this:

Hint: The user can find the number with a maximum of 6 questions if he uses the strategy of BinarySearch: he always has to answer with the average of the current known lower and upper limit, which is 30 in the beginning. If the hidden number is greater, he shall answer 45. If it's smaller 15, ... .