This is a quick tip post, but there's a tonne of "cool" syntax features in ES6, but when you dig around a little more you'll find a few nicities knocking around (which I tend to find by playing in devtools' console).
UK EVENTAttend ffconf.org 2024
The conference for people who are passionate about the web. 8 amazing speakers with real human interaction and content you can't just read in a blog post or watch on a tiktok!
£249+VAT - reserve your place today
I was recently working on a node based project which needed to format a number from 1600.6666
to £1,600.67
. Initially I went spelunking for a npm package that did the job for me. I found format.js and numeral.js…and quite a number of other options.
But why add another library to my code, when I can use ES6?
toLocaleString(…)
Enter toLocaleString
with powerups! Firstly, the function is available on a few prototype chains, including String
and Number
. We want the the Number
(i.e. "1000".toLocaleString()
doesn't do want we want).
Let's take a look (or play with this bin):
// => 1,600.667
(1600.666666).toLocaleString();
// => 1.600,667
(1600.666666).toLocaleString('de-DE');
// => 1,600.67
(1600.666666).toLocaleString('gb-GB', {
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
// => 1,600.00
(1600).toLocaleString('gb-GB', {
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
So now instead of messing around with Math.round
or .toFixed
, if I have support for toLocaleString
, then I'll use it for perfect formating.