Table of Contents
Because of how different each country/region formats it, properly formatting a currency from a number is difficult.
For example, in the US, a comma is used to separate the thousands, but in France, a dot is used to separate the thousands.
In this post, we'll learn the proper way to convert a number to a currency.
Converting a number to a currency
First let's start out with our value:
JAVASCRIPTconst value = 25;
Let's say we want to be able to convert this to $25.00. The best way to do this is to use JavaScript's internationalization API.
Included in this API is a number formatter that supports currency.
Let's define a number formatter that we can use to format 25 into $25.00.
JAVASCRIPTconst formatter = new Intl.NumberFormat("en-US", {
style: "currency",
currency: "USD",
minimumFractionDigits: 2
});
Now, using this formatter object, we just need to call the format function and pass in the number you want to format.
JAVASCRIPTconst value = 25;
const formatter = new Intl.NumberFormat("en-US", {
style: "currency",
currency: "USD",
minimumFractionDigits: 2
});
const formatted = formatter.format(value);
console.log(formatted);
BASH$25.00
The style property is used to designate that we want to format the number as a currency.
The currency property is used to specify the currency, in this case, it's USD.
The minimumFractionDigits property is used to specify the minimum number of digits after the decimal, which for currencies is usually 2.
The cool part about this API is that switching to euros in France is as simple as changing the currency property to EUR and en-US to fr-FR.
JAVASCRIPTconst value = 25;
const formatter = new Intl.NumberFormat("fr-FR", {
style: "currency",
currency: "EUR",
minimumFractionDigits: 2
});
const formatted = formatter.format(value);
console.log(formatted);
BASH25,00 €
This API and number formatter takes the hard work out of formatting currencies for you.
Conclusion
In this post, we learned how to convert a number to a currency.
Simply invoke the format function from the Intl.NumberFormat object and pass in the number you want to format.
Thanks for reading and happy coding!
Getting Started with TypeScript
How to Install Node on Windows, macOS and Linux
How to Serve Static Files with Nginx and Docker
How to Set Up Cron Jobs in Linux
Best Visual Studio Code Extensions for 2022
Learn how to use v-model with a custom Vue component
How to Scrape the Web using Node.js and Puppeteer
Getting Started with Handlebars.js
Build a Real-Time Chat App with Node, Express, and Socket.io
Learn how to build a Slack Bot using Node.js
Creating a Twitter bot with Node.js
Building a Real-Time Note-Taking App with Vue and Firebase
