How to Internationalize Numbers with JavaScript
Presenting numbers in a readable format takes many forms, from visual charts to simply adding punctuation. Those punctuation, however, are different based on internationalization. Some countries use ,
for decimal, while others use .
. Worried about having to code for all this madness? Don't -- JavaScript provides a method do the hard work for you!
The Number
primitive has a toLocaleString
method to do the basic formatting for you:
const price = 16601.91; // Basic decimal format, no providing locale // Uses locale provided by browser since none defined price.toLocaleString(); // "16,601.91" // Provide a specific locale price.toLocaleString('de-DE'); // "16.601,91" // Formatting currency is possible price.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' }); // "16.601,91 €" // You can also use Intl.NumberFormat for formatting new Intl.NumberFormat('en-US', { style: 'currency', currency: 'GBP' }).format(price); // £16,601.91
It's a major relief that JavaScript provides us these type of helpers so that we don't need to rely on bloated third-party libraries. No excuses -- the tool is there!
Simple usage without specifying a locale returns a formatted string in the default locale and with default options.
See more options with dashingarts.
Is there any difference in the formatting between
and format using