Nathan

Posted on Sep 9, 2021 • Originally published at natclark.com

Formatting Currency Values in JavaScript

#javascript #webdev

Did you know that JavaScript can save you from the burden of manually formatting currency values?

The built-in Internationalization API's Number Formatter offers many useful methods.

Here is a basic example:

const num = 21489.524;

const dollars = new Intl.NumberFormat(`en-US`, {
    currency: `USD`,
    style: 'currency',
}).format(num);

In this example, dollars will return "$21,489.52".

Pretty neat, right?

JavaScript inserts the specified currency symbol in the right place for us, which in this case, is USD.

It also adds commas and decimals based on the style (currency), and places them according to the localization code (en-US).

Here is one more example, using Euros and European formatting instead:

const num = 21489.524;

const euros = new Intl.NumberFormat(`fr-FR`, {
    currency: `EUR`,
    style: 'currency',
}).format(num);

This time, euros will return "21 489,52 €".

Conclusion

This is something I use quite often, and it's saved me a lot of time.

I wish I knew about it sooner, and I hope you find it just as useful for formatting your monetary units on the fly!

Thanks for reading.

Thank you for this wonderful post it was really inspiring I got inspired so I created a currency converter in Rust with WebAssebmly.

Thank you so much.

Thanks man, it will speed up my app alot, as now im using third party api for currency conversion

I'm so glad to hear that! Thanks for sharing.

I love INTL!! Awesome write up!

Thanks! Intl is pretty great.