Formatting Numbers as Currency in JavaScript: 3 Best Ways

Online Python Trainer for Beginners

Learn Python easily without overwhelming theory. Solve practical tasks with automatic checking, get hints in Russian, and write code directly in your browser — no installation required.

Start Course

Money loves order: how to turn a number into a beautiful price in JavaScript?

Imagine: you are writing an online store. The server returns the product price — just a number 1999.5. Showing the user a "raw" number is bad form. The client wants to see "$1,999.50" or, if you are in Russia, "1 999,50 ₽".

This question plagues thousands of developers on Stack Overflow. Today, we will finally figure out how to properly format numbers into currency strings in JavaScript. You will learn about built-in methods, their features, and when to use which approach.

Why is simply using `.toFixed(2)` a bad idea?

Many beginners do this:

const price = 1999.5;console.log('$' + price.toFixed(2)); // "$1999.50"

It seems to work. But this is a ticking time bomb. Why?

No digit group separators. $1999.50 is harder to read than $1,999.50.
No localization. In Europe, a comma is the decimal separator, and a dot is the thousands separator. Your code will break.
The currency symbol is hardcoded. Changing $ to € means modifying the code.

Fortunately, modern JavaScript provides us with elegant tools. Let's explore them.

Method #1: `Intl.NumberFormat` — the king of formatting (recommended)

This object is part of the Internationalization API. It is specifically designed for working with locales, currencies, and numbers. This is the most correct and flexible way.

Basic example

const formatter = new Intl.NumberFormat('ru-RU', {    style: 'currency',    currency: 'RUB'});

console.log(formatter.format(1999.5)); // "1 999,50 ₽"

That's it! JavaScript automatically placed spaces, commas, and added the ruble symbol. Magic, right?

How does it work?

The constructor takes two arguments:

locales — a string with the locale code (e.g., 'en-US', 'de-DE', 'ru-RU').
options — a configuration object. Key settings: style: 'currency' and currency: 'USD'.

Configuration for any currency

Want US dollars?

const usFormatter = new Intl.NumberFormat('en-US', {    style: 'currency',    currency: 'USD'});console.log(usFormatter.format(2500)); // "$2,500.00"

Euros for Germany?

const deFormatter = new Intl.NumberFormat('de-DE', {    style: 'currency',    currency: 'EUR'});console.log(deFormatter.format(2500)); // "2.500,00 €"

Notice: in Germany, a dot is the thousands separator, and a comma is the decimal point. Intl handles everything for you.

Additional options

Want to remove the fractional part (no cents)?

const formatter = new Intl.NumberFormat('en-US', {    style: 'currency',    currency: 'USD',    minimumFractionDigits: 0,    maximumFractionDigits: 0});console.log(formatter.format(1999.5)); // "$2,000" (rounded)

Need to always show 4 decimal places? No problem:

const preciseFormatter = new Intl.NumberFormat('en-US', {    style: 'currency',    currency: 'USD',    minimumFractionDigits: 4});console.log(preciseFormatter.format(1.2)); // "$1.2000"

Pros: native, fast, supports all world currencies, easy to change locale.

Cons: does not work in very old browsers (IE 10 and below — but that's history now).