This content originally appeared on Raymond Camden and was authored by Raymond Camden
A few days ago I shared a blog post about using the Intl object in JavaScript to create short, more readable numbers. So for example, instead of 9123456, it would display 9.1M. This was done using the notation
option in Intl.NumberFormat
. Yesterday I randomly ran into an interesting modification on this using yet another option, compactDisplay
.
The compactDisplay
option is only used when notation
is set to compact
. It supports two options, short
which is default and what I demonstrated in the previous post, and long
.
So given a number, i
, you would use it like so:
new Intl.NumberFormat('en-US', { notation:'compact', compactDisplay:'long'}).format(i);
And the result is, well, longer. ;) What's nice though is that it's still a shortened, simpler version. You can see the result here:
See the Pen Intl Number Formatting (long) by Raymond Camden (@cfjedimaster) on CodePen.
Awesome. And if you want to dig deeper into Intl, I recommend the very cool Intl Explorer site. It's an interactive explorer for the Intl spec and covers everything. (If I had paid more attention to it, I would have seen compact
sooner!)
This content originally appeared on Raymond Camden and was authored by Raymond Camden
Raymond Camden | Sciencx (2023-01-10T18:00:00+00:00) Followup to My Intl Short Number Post. Retrieved from https://www.scien.cx/2023/01/10/followup-to-my-intl-short-number-post/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.