JavaScript Academy · Lesson

Formatting Numbers and Currency

Use Intl.NumberFormat for locale-aware numbers.

Lesson 1 of 413 steps

Formatting Numbers and Currency is a free JavaScript Academy lesson on CoddyKit. This is lesson 1 of 4. Any 3 lessons of this learning path are free to read in full — after that, CoddyKit PRO unlocks every lesson, plus hands-on practice with a built-in code editor and a 24/7 AI tutor. It is part of the JavaScript Academy learning path, and your progress syncs across the web and the CoddyKit app. The JavaScript Academy course includes 4 lessons in total.

The Intl Namespace

Intl is the built-in JavaScript internationalization API. It formats numbers, dates, currencies, and more according to a locale's conventions — no library needed.

console.log(typeof Intl); // "object"
console.log(typeof Intl.NumberFormat); // "function"

Intl.NumberFormat Basics

Create a formatter with a locale, then call format(). Locales use BCP 47 tags like "en-US" or "de-DE".

const nf = new Intl.NumberFormat("en-US");
console.log(nf.format(1234567.89)); // "1,234,567.89"

Locale Differences

The same number renders differently per locale. German uses dots for thousands and a comma for decimals.

const n = 1234567.89;
console.log(new Intl.NumberFormat("en-US").format(n)); // 1,234,567.89
console.log(new Intl.NumberFormat("de-DE").format(n)); // 1.234.567,89

Currency Formatting

Pass style: "currency" and a currency code. The symbol and placement follow the locale.

const usd = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
console.log(usd.format(2999.5)); // "$2,999.50"

Currency Across Locales

The currency stays the same but its presentation adapts to the chosen locale.

const opts = { style: "currency", currency: "EUR" };
console.log(new Intl.NumberFormat("en-IE", opts).format(1000)); // €1,000.00
console.log(new Intl.NumberFormat("de-DE", opts).format(1000)); // 1.000,00 €

Percent Style

style: "percent" multiplies the value by 100 and appends the locale's percent sign.

const pct = new Intl.NumberFormat("en-US", { style: "percent" });
console.log(pct.format(0.1875)); // "19%"
console.log(new Intl.NumberFormat("en-US", { style: "percent", maximumFractionDigits: 2 }).format(0.1875)); // "18.75%"

Controlling Fraction Digits

minimumFractionDigits and maximumFractionDigits control decimal places.

const f = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
console.log(f.format(3));    // "3.00"
console.log(f.format(3.14159)); // "3.14"

Units

style: "unit" with a unit formats measurements like kilometers or liters.

const speed = new Intl.NumberFormat("en-US", { style: "unit", unit: "kilometer-per-hour" });
console.log(speed.format(120)); // "120 km/h"

Compact Notation

notation: "compact" abbreviates large numbers (1.2K, 3.4M) — great for social counts.

const c = new Intl.NumberFormat("en-US", { notation: "compact" });
console.log(c.format(1500));    // "1.5K"
console.log(c.format(2300000)); // "2.3M"

Sign Display

signDisplay: "always" shows a sign even for positives — handy for deltas and changes.

const s = new Intl.NumberFormat("en-US", { signDisplay: "always" });
console.log(s.format(5));  // "+5"
console.log(s.format(-5)); // "-5"

Reuse Formatters

Creating a formatter is relatively expensive. Build it once and reuse it for many values rather than constructing one per call.

const money = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
const prices = [9.99, 19.5, 100];
console.log(prices.map((p) => money.format(p)));

Quick Check

Test number formatting.

Answer it in the interactive lesson

Recap: Numbers and Currency

You formatted numbers per locale, handled currency, percent, units, compact notation, and sign display, controlled fraction digits, and learned to reuse formatters. Next: dates and times.

Free to start

Learn JavaScript with an AI tutor — free

Write and run real code in your browser, get instant help from a 24/7 AI tutor, and pick up where you left off on the web or in the app.

Courses: 59
Lessons: 200

Start learning free View the full course

Frequently Asked Questions

Is the “Formatting Numbers and Currency” lesson free?

Yes — any 3 lessons of the JavaScript Academy learning path, including “Formatting Numbers and Currency”, are free to read in full here on the web. After that, CoddyKit PRO unlocks every lesson, plus interactive practice with a built-in code editor and a 24/7 AI tutor. The JavaScript Academy course includes 4 lessons in total.

What will I learn in “Formatting Numbers and Currency”?

Use Intl.NumberFormat for locale-aware numbers. You practise JavaScript Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start JavaScript Academy?

No prior experience is required. JavaScript Academy on CoddyKit is structured for beginners through advanced learners, so you can start here or from the beginning and move at your own pace. This is lesson 1 of 4.

How long does the “Formatting Numbers and Currency” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this JavaScript Academy lesson?

Yes. Every JavaScript Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

← Back to JavaScript Academy