Intl.NumberFormat

Formatting numbers on the client side is an important task, especially when you consider how much raw API usage is in play these days. What’s also important is ensuring those numbers are meaningful to users, no matter where they are in the world, especially if you’re an eCommerce website. Writing internationalization code can be a […]

The post Intl.NumberFormat appeared first on David Walsh Blog.


This content originally appeared on David Walsh Blog and was authored by David Walsh

Formatting numbers on the client side is an important task, especially when you consider how much raw API usage is in play these days. What’s also important is ensuring those numbers are meaningful to users, no matter where they are in the world, especially if you’re an eCommerce website.

Writing internationalization code can be a nightmare but luckily JavaScript provides us Intl.NumberFormat, an API for internationalizing numbers as currencies and more. Let’s check it out!

Some examples of Intl.NumberFormat include:

new Intl.NumberFormat().format(12345)
// 12,345

new Intl.NumberFormat('en-US', { maximumSignificantDigits: 4}).format(1.2345678)
// 1.235 (Notice the rounding)

new Intl.NumberFormat('en-GB', { style: 'currency', currency: 'GBP' }).format(9002.20)
// £9,002.20

new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(9002.20)
// 9.002,20 €

new Intl.NumberFormat().formatToParts(12345.678)
/*
[
   { "type":"integer", "value":"12" },
   { "type":"group", "value":"," },
   { "type":"integer", "value":"345" },
   { "type":"decimal", "value":"." },
   { "type":"fraction", "value":"678" }
]
*/

Don’t bother writing your own client side number formatting functions if the numbers you want to present are standard formats — leverage the amazing APIs the browser provides you!

The post Intl.NumberFormat appeared first on David Walsh Blog.


This content originally appeared on David Walsh Blog and was authored by David Walsh


Print Share Comment Cite Upload Translate Updates
APA

David Walsh | Sciencx (2021-04-13T01:05:50+00:00) Intl.NumberFormat. Retrieved from https://www.scien.cx/2021/04/13/intl-numberformat/

MLA
" » Intl.NumberFormat." David Walsh | Sciencx - Tuesday April 13, 2021, https://www.scien.cx/2021/04/13/intl-numberformat/
HARVARD
David Walsh | Sciencx Tuesday April 13, 2021 » Intl.NumberFormat., viewed ,<https://www.scien.cx/2021/04/13/intl-numberformat/>
VANCOUVER
David Walsh | Sciencx - » Intl.NumberFormat. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/04/13/intl-numberformat/
CHICAGO
" » Intl.NumberFormat." David Walsh | Sciencx - Accessed . https://www.scien.cx/2021/04/13/intl-numberformat/
IEEE
" » Intl.NumberFormat." David Walsh | Sciencx [Online]. Available: https://www.scien.cx/2021/04/13/intl-numberformat/. [Accessed: ]
rf:citation
» Intl.NumberFormat | David Walsh | Sciencx | https://www.scien.cx/2021/04/13/intl-numberformat/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.