# 3 Ways To Format Number As Currency String In Javascript

Welcome to a quick tutorial on how to format a number as a currency string in Javascript. Need to display a number in a “nice currency format” after some calculations?

The easy ways to format a number as a currency string in Javascript are:

1. Use the native number format object.
• `var amt = 12345;`
• `var usd = new Intl.NumberFormat("en-US", { style: "currency", "currency":"USD" }).format(amt);`
2. Use regular expressions.
• `var amt = 54321;`
• `amt = "\$" + amt.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");`
3. Manually format the number.
• `var raw = "12345", amt = "";`
• `for (let i=raw.length-1, j=1; i>=0; i--, j++) {`
• `  amt = raw[i] + amt;`
• `  if (j%3==0 && i!=0) { amt = "," + amt; }`
• `}`

That covers the quick basics, but read on for detailed examples!

## TLDR – QUICK SLIDES

[web_stories_embed url=”https://code-boxx.com/web-stories/format-number-as-currency-string-in-javascript/” title=”Format Number As Currency String In Javascript” poster=”https://code-boxx.com/wp-content/uploads/2021/11/STORY-JS-20230518.webp” width=”360″ height=”600″ align=”center”]

## NUMBER TO CURRENCY

All right, let us now get into the examples of converting a number into a currency in Javascript.

### METHOD 1) NUMBER FORMAT

1-num-format.html
``````// (A) THE NUMBER
var amount = 123456;

// (B) TO USD - \$123,456.00
var usd = new Intl.NumberFormat("en-US", {
style: "currency",
currency: "USD"
}).format(amount);
console.log(usd);

// (C) TO JPY - ¥123,456
var jpy = new Intl.NumberFormat("jp-JP", {
style: "currency",
currency: "JPY"
}).format(amount);
console.log(jpy);

// (D) EURO - €123,456.00
var eur = new Intl.NumberFormat("en-GB", {
style: "currency",
currency: "EUR"
}).format(amount);
console.log(eur);``````

This is the modern and fastest way to format a currency string in Javascript. Just use `Intl.NumberFormat()` and Javascript will do the rest of the formatting magic. A couple of notes here:

P.S. `Intl.NumberFormat` is well supported in most modern browsers. But if you have to work with ancient browsers, manual formatting is the only way to go.

### METHOD 2) REGULAR EXPRESSION

2-regular-expression.html
``````// CREDIT: https://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript
// (A) CONVERT TO CURRENCY (DOLLARS)
function tocur (amount) {
return "\$" + amount
.toString()
.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

// (B) TEST
var testA = tocur(1234567),
testB = tocur(123456.78);
console.log(testA); // \$1,234,567
console.log(testB); // \$123,456.78``````

Not going to explain regular expressions too much, that is a can of worms on its own. But in simple terms, what it does is:

• Convert the number into a string.
• Add a comma for every 3 digits (thousands separator).
• Prepend a dollar sign in front.

### METHOD 3) MANUAL CURRENCY STRING

3-manual-string.html
``````// (A) CURRENCY CONVERSION FUNCTION (DOLLARS)
function tocur (amount) {
// (A1) NUMBER TO STRING
var amount = amount.toString(),
dec = ".00",
temp = amount.indexOf(".");

// (A2) EXTRACT DECIMALS (IF ANY)
if (temp != -1) {
dec = amount.substring(temp);
amount = amount.substring(0, temp);
}

// (A3) ADD THOUSAND SEPARATORS
if (amount.length>3) {
temp = "";
for (let i=amount.length-1, j=1; i>=0; i--, j++) {
temp = amount[i] + temp;
if (j%3==0 && i!=0) { temp = "," + temp; }
}
amount = temp;
}

// (A4) RESULT
return "\$" + amount + dec;
}

// (B) TEST
var testA = tocur(1234567),
testB = tocur(123456.78);
console.log(testA); // \$1,234,567.00
console.log(testB); // \$123,456.78``````

Lastly, this is the “hardcore old-school” way of formatting a number into a currency string. Yep, that’s how we roll in the ancient days. A little long-winded, but at least it has good backward compatibility.

Here is the download link to the example code, so you don’t have to copy-paste everything.

### SORRY FOR THE ADS...

But someone has to pay the bills, and sponsors are paying for it. I insist on not turning Code Boxx into a "paid scripts" business, and I don't "block people with Adblock". Every little bit of support helps.

Click here for the source code on GitHub gist, just click on “download zip” or do a git clone. I have released it under the MIT license, so feel free to build on top of it or use it in your own project.

## EXTRA BITS & LINKS

That’s all for the tutorial, and here is a small section on some extras and links that may be useful to you.

## THE END

Thank you for reading, and we have come to the end. I hope that it has helped you to better understand, and if you want to share anything with this guide, please feel free to comment below. Good luck and happy coding!