Skip to content
WANCODE
BM

Numbers and Operators

14 minBeginnerHTML · CSS · JS

In this lesson

  • Use + - * / % and **, and predict the order they run in
  • Update variables with +=, -= and ++
  • Explain NaN and the floating-point surprise in 0.1 + 0.2
  • Show money with toFixed(2) and round with Math.round

The big idea

JavaScript is a calculator that never gets tired — but it follows maths rules strictly, and decimals are stored approximately. Know the rules and money will always add up.

The operators

JavaScript
console.log(10 + 3);  // 13   add
console.log(10 - 3);  // 7    subtract
console.log(10 * 3);  // 30   multiply
console.log(10 / 4);  // 2.5  divide
console.log(10 % 3);  // 1    remainder ("what's left over")
console.log(2 ** 3);  // 8    power (2 × 2 × 2)

Order matters, just like in maths class: brackets first, then **, then * / %, then + -. Operators with the same rank run left to right. When in doubt, add brackets — they cost nothing and make your intention clear.

Without brackets

JavaScript
const price = 10 + 5 * 2;
console.log(price); // 20, not 30

With brackets

JavaScript
const price = (10 + 5) * 2;
console.log(price); // 30

Remainder: the most underrated operator

% gives what's left after dividing. It answers questions like "is this number even?" (n % 2 is 0) and "125 minutes is how many hours and minutes?" Pair it with Math.floor, which chops off the decimals:

JavaScript
const minutes = 125;
const hours = Math.floor(minutes / 60); // 2
const rest = minutes % 60;              // 5
console.log(hours + "h " + rest + "m"); // 2h 5m

Changing a number in place

JavaScript
let points = 10;
points += 5;  // same as points = points + 5   → 15
points -= 3;  // same as points = points - 3   → 12
points *= 2;  // same as points = points * 2   → 24
points++;     // add exactly 1                 → 25
points--;     // subtract exactly 1            → 24

These only work on let variables — a const can't be changed.

NaN: "Not a Number"

When maths makes no sense, JavaScript doesn't crash — it gives NaN. For example Number("RM12") is NaN because RM12 isn't a number, and "abc" * 2 is NaN too. Any maths with NaN gives NaN, so one bad value can quietly spoil a whole calculation. Also watch out for + with text: "12.50" + 5 joins them into "12.505". Convert text to a number first with Number(...).

The 0.1 + 0.2 surprise

JavaScript
console.log(0.1 + 0.2);            // 0.30000000000000004  (!)
console.log((0.1 + 0.2).toFixed(2)); // "0.30"  (a string, for display)
console.log(Math.round(2.5));       // 3
console.log(Math.round(1234.5678 * 100) / 100); // 1234.57

Computers store decimals in binary, and numbers like 0.1 can't be stored exactly — the same way 1/3 can't be written exactly as 0.333… This isn't a JavaScript bug; most programming languages do it. For money, two good habits: show amounts with toFixed(2) (it gives back a string like "25.10"), and calculate in whole sen when precision matters (Math.round(ringgit * 100)).

toFixed returns a string. Use it at the very end, when you're about to show the number — not in the middle of a calculation.

Three plates of nasi lemak and two teh tarik should come to RM25.10, but the console says something else. Work out why (think about which operators run first), fix the total calculation, and make the console show the amount with exactly two decimal places: Total: RM25.10.

Checks

  • total equals 3 × nasi lemak + 2 × teh tarik
  • The calculation uses the price and quantity variables
  • The console shows Total: RM25.10

Check understanding

Q1

What does 2 + 3 * 4 give?

Q2

What is 17 % 5?

Q3

What does (9.5).toFixed(2) give?

What you learned

  • * / % run before + -; use brackets to make the order obvious.
  • % gives the remainder; Math.floor drops decimals; += and ++ update a let in place.
  • Text + number joins text. Convert with Number(...); impossible maths gives NaN.
  • Decimals are approximate (0.1 + 0.2). Show money with toFixed(2) and count in sen when precision matters.
Preview

Console output from your code appears here.

Step 1 of 3