Working with Numbers
Beginner · 18 min read · ▶ live playground · ✦ checkpoint
JavaScript numbers look friendly right up until your receipt says 0.30000000000000004. You can still trust numbers, but only if you know which kind of math JavaScript is doing and where money needs extra care.
One regular number type
JavaScript has one regular number type for 7, 3.14, -20, and 0. Other languages often split whole numbers and decimal numbers into separate types. JavaScript doesn't: regular numbers all use 64-bit floating point, a fixed-size format that stores many values exactly and stores some decimals as close approximations.
That means the same type handles a game score, a price, a temperature, and a percentage:
const playerScore = 42;
const coffeePrice = 3.75;
const temperature = -4;
console.log(typeof playerScore);
console.log(typeof coffeePrice);
console.log(typeof temperature);→ number, number, then number.
Think of regular numbers as one calculator with a huge range. It handles everyday arithmetic well, but it still has a fixed display inside the machine. Some decimal answers won't fit perfectly.
Operators and order
An arithmetic operator is a symbol that tells JavaScript to do math: +, -, *, /, **, and %.
+adds.-subtracts.*multiplies./divides.**raises a number to a power.%gives the remainder, the amount left after division fits as many full times as possible.
Precedence is the rule for which operators run first. Multiplication and division run before addition and subtraction. Parentheses let you choose a different order.
const basePoints = 10;
const bonusPoints = 5;
const players = 3;
const normalTotal = basePoints + bonusPoints * players;
const groupedTotal = (basePoints + bonusPoints) * players;
const leftoverBadges = 17 % 5;
const bossHealth = 2 ** 5;
console.log(normalTotal);
console.log(groupedTotal);
console.log(leftoverBadges);
console.log(bossHealth);→ 25, 45, 2, then 32.
Read % as "what's left over?", not "percent". 17 % 5 is 2 because three full groups of five use 15, and 2 badges remain.
The decimal surprise
Here is the number bug people meet in real work:
const receiptTotal = 0.1 + 0.2;
const displayTotal = receiptTotal.toFixed(2);
const tinyDifference = Math.abs(receiptTotal - 0.3);
console.log(receiptTotal);
console.log(displayTotal);
console.log(typeof displayTotal);
console.log(0.1 + 0.2 === 0.3);
console.log(tinyDifference);
console.log(tinyDifference < 0.000001);→ 0.30000000000000004, 0.30, string, false, 5.551115123125783e-17, then true.
This happens because regular numbers are stored as binary fractions. Binary means base 2: the engine stores pieces built from 0 and 1. Some decimals, including 0.1, cannot be stored exactly in that format, the same way 1 / 3 cannot be written exactly as a short decimal.
The equality line is there only to make the result visible. Lesson 4.2 teaches equality in depth. For now, the numeric fact is enough: 0.1 + 0.2 produces a tiny extra crumb, so exact decimal comparisons can surprise you. Math.abs gives distance from zero; more Math tools appear below.
For decimal comparisons that are not money, compare whether two results are close enough. The < comparison asks "is the left side smaller than the right side"; comparison operators get their full treatment in lesson 4.1.
The practical money rule is boring and strong: store money as integer cents, then format it only when you display it. An integer is a whole number with no decimal part.
const coffeeCents = 325;
const cookieCents = 249;
const tipCents = 175;
const totalCents = coffeeCents + cookieCents + tipCents;
const dollars = totalCents / 100;
const receipt = Intl.NumberFormat("en-US", {
style: "currency",
currency: "USD",
}).format(dollars);
console.log(totalCents);
console.log(receipt);→ 749, then $7.49.
The braces above are an options object, a grouped value that tells the formatter what style you want; object mechanics come in Section 7.
NaN, Infinity, and number tools
NaN means "Not-a-Number", a number value that represents a failed numeric result. Infinity is a number value that represents a result beyond ordinary finite size. Finite means not endless.
The Number object is a built-in group of number tools, and a method is a command you call with a dot. You already know the shape from console.log(...).
const impossibleScore = 0 / 0;
const runawayScore = 10 / 0;
const parsedLevel = parseInt("42px", 10);
const parsedPrice = parseInt("19.99", 10);
console.log(impossibleScore);
console.log(Number.isNaN(impossibleScore));
console.log(runawayScore);
console.log(parsedLevel);
console.log(parsedPrice);→ NaN, true, Infinity, 42, then 19.
parseInt reads text from the left and stops when the integer part ends. The 10 says "read these as base-10 digits." That's useful for "42px", but it cuts "19.99" down to 19. Lesson 2.4 teaches explicit conversion with Number() when you want to convert whole values more directly.
Try it — inspect the edge cases
Run this once, then change the prices and scores. Try parseInt("08 points", 10), change 0.2 to 0.7, and ask the › prompt for typeof displayTotal.
Math and huge whole numbers
The Math object is JavaScript's built-in group of number tools. You don't need to build these yourself.
const rating = 4.6;
const refund = -12.75;
const topScore = Math.max(80, 92, 88);
console.log(Math.round(rating));
console.log(Math.floor(rating));
console.log(Math.ceil(rating));
console.log(Math.abs(refund));
console.log(topScore);
const regularHugeTicket = 9007199254740993;
const bigintHugeTicket = 9007199254740993n;
console.log(regularHugeTicket);
console.log(bigintHugeTicket);→ 5, 4, 5, 12.75, 92, 9007199254740992, then 9007199254740993n.
Math.round, Math.floor, and Math.ceil round in different directions. Math.abs gives distance from zero, so a negative refund becomes a positive amount. Math.max picks the largest value.
That last pair shows why BigInt exists. A safe integer is a whole number JavaScript can represent exactly as a regular number. Past the safe range, regular numbers may round. BigInt uses the n ending and keeps huge whole numbers exact. It is for whole numbers only, and you don't mix number and bigint in the same arithmetic expression.
Numbers are now useful and honest: you can calculate, format, and recognize the edges. Next, you'll connect these values to a person at the keyboard and learn how JavaScript turns typed text into the values your program needs.
Checkpoint
Answer all three to mark this lesson complete