Javascript popup box are extremely useful when you start coding in Javascript. They enable you to write basic programs based on the Input/Process/Output very easily.
alert(“…”)
An alert box is an easy approach in javascript to display a message to the end user. It can be used as a form of output (equivalent to a print() statement in Python). The main drawback (or benefit?) of an alert box is that the Javascript code will pause until the user closes the popup box.
alert("Hello world!");Try this code!
prompt(“…”)
An prompt box is an easy approach in javascript to retrieve a user input from the end user. It can be used as a form of input (equivalent to a input() statement in Python). The value returned by a prompt() function can then be stored in a variable.
var name; name = prompt("What's your name?"); alert("Hello " + name + "!");Try this code!
confirm(“…”)
A confirm box is used when you need the user to verify or accept something.
When a confirm box pops up, the user has to click either “OK” or “Cancel” to proceed.
If the user clicks “OK”, the box returns true. If the user clicks “Cancel”, the box returns false.
var play = confirm("Would you like the play a game of heads or tails?"); if (play==true) { if (Math.floor(Math.random() * 2) == 0) { alert("Heads!"); } else { alert("Tails!"); } } else { alert("Good bye then!"); }Try this code!
Your Turn
Use the codepen below to create pure Javascript games or programs based on the input/process/output model.
You can look at the following challenges to implement these using Javascript.
- Weight on the Moon Calculator
- Hogwarts Sorting Hat Challenge
- Fizz Buzz Game
- Guess the number
- Rock Paper Scissors
See the Pen
Heads or Tails by 101 Computing (@101Computing)
on CodePen.