Vanilla JavaScript Number toLocaleString

— 3 minute read

permalink

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 permalink

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 permalink

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 permalink

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.

See the Pen Vanilla JavaScript Number toLocaleString by Chris Bongers (@rebelchris) on CodePen.

Browser Support permalink

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

View on CanIUse

Thank you for reading, and let's connect! permalink

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