In this case, we are using constants to store references to parts of our user interface the text inside some of them might change, but the HTML elements referenced stay the same. Constants are used to store values that you don't want to change, and are created with the keyword const. You create a variable with the keyword let (or var) followed by a name for your variable (you'll read more about the difference between the keywords in a future article). Variables are basically containers for values (such as numbers, or strings of text). This section of the code sets up the variables and constants we need to store the data our program will use. Let randomNumber = Math.floor(Math.random() * 100) + 1 Ĭonst guesses = document.querySelector('.guesses') Ĭonst lastResult = document.querySelector('.lastResult') Ĭonst lowOrHi = document.querySelector('.lowOrHi') Ĭonst guessSubmit = document.querySelector('.guessSubmit') Ĭonst guessField = document.querySelector('.guessField') The place where we'll be adding all our code is inside the element at the bottom of the HTML: At the moment you'll see a simple heading, paragraph of instructions and form for entering a guess, but the form won't currently do anything. Open it in both your text editor and your web browser. To begin with this recipie tutorial, we'd like you to make a local copy of the number-guessing-game-start.html file. To have a first bit of experience at writing some JavaScript, and gain at least a basic understanding of what writing a JavaScript program involves. Once the game restarts, make sure the game logic and UI are completely reset, then go back to step 1.īasic computer literacy, a basic understanding of HTML and CSS, an understanding of what JavaScript is.If it is wrong and the player has no turns left:.If it is wrong and the player has turns left:.Display control allowing the player to restart the game.Stop the player from being able to enter more guesses (this would mess the game up).Next, check whether it is the correct number.Once a guess has been submitted first record it somewhere so the user can see their previous guesses.Provide the player with a way to guess what the number is.Record the turn number the player is on.Generate a random number between 1 and 100.Upon looking at this brief, the first thing we can do is to start breaking it down into simple actionable tasks, in as much of a programmer mindset as possible: When the game ends, the player should be given an option to start playing again. The game will end once the player guesses correctly, or once they run out of turns. It would also tell the player what numbers they previously guessed. After each turn the player would be told if they are right or wrong - and, if they are wrong, whether the guess was too low or too high. It will choose a random number between 1 and 100, then challenge the player to guess the number in 10 turns. We will create a simple guess the number type game.
0 Comments
Leave a Reply. |