How to Format Numbers as Currency Strings in JavaScript

By the end of this page, you will understand how to turn JavaScript numbers into currency strings, including adding a currency symbol, thousands separators, and fixed decimal places. You will also learn why Intl.NumberFormat is usually the best modern solution, and when simpler approaches like toFixed() may still be useful.

Formatting a number as currency means converting a raw numeric value such as 2500 or 2500.5 into a human-friendly string such as $2,500.00.

In JavaScript, this usually involves three separate formatting tasks:

• adding a currency symbol like $
• showing the correct number of decimal places, usually 2 for many currencies
• inserting thousands separators like commas

This matters because raw numbers are fine for calculations, but not ideal for display. Users expect prices, totals, invoices, and reports to be clearly formatted.

There are two common approaches in JavaScript:

1. Manual formatting using methods like toFixed() and string manipulation
2. Built-in international formatting using Intl.NumberFormat

For real applications, Intl.NumberFormat is usually the best choice because:

• it handles commas and decimals correctly for different locales
• it supports many currencies
• it avoids a lot of custom string logic
• it is easier to maintain

For example, the same number may be displayed differently depending on region:

• US: $2,500.00
• Germany: 2.500,00 €
• Japan: ￥2,500

So the main idea is: store values as numbers, but format them as strings only when displaying them to users.

Think of a number as the raw value inside a calculator, and currency formatting as the label you attach when presenting the result to a person.

The calculator only cares about the value:

2500

But a user wants a nicely printed price tag:

$2,500.00

So formatting is like packaging a plain item before putting it on a store shelf. The value stays numeric internally, but the displayed version becomes easier to read.

A simple modern solution uses Intl.NumberFormat.

function formatCurrency(amount) {
  return new Intl.NumberFormat("en-US", {
    style: "currency",
    currency: "USD"
  }).format(amount);
}

console.log(formatCurrency(2500));
console.log(formatCurrency(2500.5));
console.log(formatCurrency(2500.99));

Output:

$2,500.00
$2,500.50
$2,500.99

How it works

• en-US tells JavaScript to use US-style number formatting
• style: "currency" means the output should be formatted as money
• selects US dollars

Consider this example:

const formatter = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD"
});

const result = formatter.format(2500.5);
console.log(result);

Step by step:

1. JavaScript creates a formatter object with US number rules.
2. style: "currency" tells it to format values as money.
3. currency: "USD" tells it to use the US dollar format.
4. formatter.format(2500.5) converts the number 2500.5 into a formatted string.
5. The result becomes:

"$2,500.50"

Trace with manual formatting

const amount = 2500.5;
const fixed = amount.toFixed(2);
const withCommas = fixed.(, );
 result =  + withCommas;

.(result);

Currency formatting is used in many everyday programming tasks:

• E-commerce: showing product prices, cart totals, discounts, and taxes
• Finance dashboards: displaying account balances, spending summaries, and revenue
• Invoices and receipts: formatting totals for printable or downloadable documents
• Admin panels: showing order values, payouts, refunds, and reports
• APIs and frontends: keeping numbers raw in data, then formatting them only in the UI

Example in a shopping cart:

const subtotal = 2499.9;
const tax = 125.45;
const total = subtotal + tax;

const usd = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD"
});

console.log("Subtotal:", usd.format(subtotal));
console.log("Tax:", usd.format(tax));
console.log("Total:", usd.format(total));

In real projects, developers usually avoid manual currency string building unless they have a very specific formatting requirement.

Common patterns include:

Reusing one formatter

Creating a formatter once is better than rebuilding it repeatedly.

const usdFormatter = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD"
});

function formatPrice(value) {
  return usdFormatter.format(value);
}

Guard clauses for invalid input

function formatPrice(value) {
  if (typeof value !== "number" || Number.isNaN(value)) {
    return "$0.00";
  }

  return new Intl.NumberFormat("en-US", {
    style: "currency",
    currency: "USD"
  }).(value);
}

Here are common beginner mistakes when formatting currency in JavaScript.

1. Using strings instead of numbers

Broken example:

const price = "2500.5";
console.log(price.toFixed(2));

This fails because toFixed() is a number method.

Fix:

const price = Number("2500.5");
console.log(price.toFixed(2));

2. Formatting too early

Broken example:

const price = "$2,500.00";
const total = price + 100;
console.log(total);

This creates string concatenation, not math.

Fix:

const price = 2500;
 total = price + ;
.(total);

toFixed() vs Intl.NumberFormat

const amount = 2500.5;

console.log(amount.toFixed());


.( .(, {
  : ,
  : 
}).(amount));

// Best modern approach
const formatter = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD"
});

formatter.format(2500);   // "$2,500.00"
formatter.format(99.5);   // "$99.50"
formatter.format(-12.75); // "-$12.75"

// Reusable function
function formatCurrency(amount) {
  return new Intl.NumberFormat("en-US", {
    style: "currency",
    currency: "USD"
  }).format(amount);
}

// Simple manual approach
function formatCurrency(amount) {
  return "$ " + amount.().(, );
}

How do I format a number as dollars in JavaScript?

Use Intl.NumberFormat:

new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD"
}).format(2500);

What is the best way to format currency in JavaScript?

For most applications, Intl.NumberFormat is the best choice because it is built in, reliable, and locale-aware.

Can I format currency with commas and two decimals manually?

Yes. You can use toFixed(2) and a regex to add commas, but this is less flexible than Intl.NumberFormat.

Why does toFixed() not add commas?

toFixed() only controls decimal places. It does not apply thousands separators or currency symbols.

Does Intl.NumberFormat work for other currencies?

Yes. You can change the locale and currency code.

 .(, {
  : ,
  : 
}).();

• Numbers in JavaScript — currency formatting starts with understanding numeric values
• Strings in JavaScript — formatted currency is ultimately a string
• toFixed() — useful for controlling decimal places
• Intl.NumberFormat — the main built-in API for locale-aware number and currency formatting
• Type conversion — important when input arrives as a string instead of a number
• Regular expressions — often used in manual comma insertion solutions
• Array map() — commonly used to format lists of prices for display