User Input and Formatting
Understand how to make JavaScript programs interactive by accepting user input with prompt and converting text input to numbers for calculations. Learn to format outputs to produce clean, professional receipts, progressing from coder-only apps to usable point-of-sale systems.
The project
We’ll go back to the POS system one last time. In the previous lesson, we entered prices, quantities, and names directly into the JavaScript code. That worked fine while we were coding, but it’s not how real systems usually work.
But here’s the problem: the cashier isn’t a coder. They don’t want to dig into code, find variables, and change values. They just want to type in the customer’s details and prices while the customer waits.
You’ve been hired to create a smarter version of this point-of-sale system, one where the cashier simply enters the quantities and prices at the command line when the app is running, and the program automatically calculates and prints the receipt. The cashier will not need to look at the code. This is what the receipt looks like:
The programming concept
The new concept for today is user input.
So far, we’ve only displayed information using console.log(). But what if we want the user, like our cashier, to type something in? That’s where user input comes in. JavaScript gives us a built-in function called prompt(). It shows a small dialog box where the user can enter information.
A key thing to remember: