Sign in
Log inSign up
Vanilla JavaScript Number toLocaleString

Vanilla JavaScript Number toLocaleString

Chris Bongers
·May 23, 2020

Yesterday we saw how to get a month's name using the toLocalString function. This made me wonder what else it could be used for, and as it turns out, we can use it for Numbers as well!

JavaScript Number toLocaleString function

The syntax for this method is the same as we saw yesterday in converting a date object.

number.toLocaleString('locale', {options});

In the most default way, we don't have to pass any arguments, and we will get the browser's default.

var number = 123456.789;

console.log(number.toLocaleString());
// 123,456.789

Number.toLocaleString locales

To use different locales we can pass along the locale parameters as such:

console.log(number.toLocaleString('nl-NL'));
// 123.456,789
console.log(number.toLocaleString('en-US'));
// 123,456.789
console.log(number.toLocaleString('en-IN'));
// 1,23,456.789

Number.toLocaleString options

This method has a lot of available options, let's say we want to convert to a local currency format.

console.log(number.toLocaleString('nl-NL', {style: 'currency', currency: 'EUR'}));
// € 123.456,79
console.log(number.toLocaleString('en-US', {style: 'currency', currency: 'USD'}));
// $123,456.79
console.log(number.toLocaleString('en-IN', {style: 'currency', currency: 'INR'}));
// ₹1,23,456.79

Awesome right!

Other styles we can use are:

View this method on Codepen.

View on Codepen.

Browser Support

This is a widely supported method, feel free to use it.

View on CanIUse

Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on Facebook or Twitter