1
0
mirror of https://github.com/jbranchaud/til synced 2026-01-03 07:08:01 +00:00

Add Format A Decimal To A Fixed Number Of Digits as a JavaScript TIL

This commit is contained in:
jbranchaud
2023-07-17 16:27:01 -05:00
parent 5cb7d74933
commit cee26f173d
2 changed files with 54 additions and 1 deletions

View File

@@ -10,7 +10,7 @@ pairing with smart people at Hashrocket.
For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186).
_1325 TILs and counting..._
_1326 TILs and counting..._
---
@@ -429,6 +429,7 @@ _1325 TILs and counting..._
- [Find The Version Of An Installed Dependency](javascript/find-the-version-of-an-installed-dependency.md)
- [Find Where Yarn Is Installing Binaries](javascript/find-where-yarn-is-installing-binaries.md)
- [for...in Iterates Over Object Properties](javascript/for-in-iterates-over-object-properties.md)
- [Format A Decimal To A Fixed Number Of Digits](javascript/format-a-decimal-to-a-fixed-number-of-digits.md)
- [Formatting Values With Units For Display](javascript/formatting-values-with-units-for-display.md)
- [Freeze An Object, Sorta](javascript/freeze-an-object-sorta.md)
- [Generate A V4 UUID In The Browser](javascript/generate-a-v4-uuid-in-the-browser.md)

View File

@@ -0,0 +1,52 @@
# Format A Decimal To A Fixed Number Of Digits
The `Intl.NumberFormat` object is a reliable way to format numbers in an
i18n-friendly way. It available with Node and all modern browsers.
If I want to format number that I expect to contain decimals, I can do so by
setting up a formatter using the `decimal` style.
```javascript
const locale = "en-US";
const options = {
style: "decimal",
};
const formatter = new Intl.NumberFormat(locale, options);
console.log(formatter.format(1234))
//=> 1,234
console.log(formatter.format(1234.5678))
//=> 1,234.568
```
Because of my locale (`en-US`), it adds a comma to deliniate the thousandth
place. By default, it formats to three decimal places excluding decimals
altogether if it is a whole number.
If I want to specify a fixed number of decimal places including for a whole
number, I can use the `minimumFractionDigits` and `maximumFractionDigits`
options.
```javascript
const locale = "en-US";
const options = {
style: "decimal",
minimumFractionDigits: 2,
maximumFractionDigits: 2,
};
const formatter = new Intl.NumberFormat(locale, options);
console.log(formatter.format(1234))
//=> 1,234.00
console.log(formatter.format(1234.5678))
//=> 1,234.57
```
Here, it includes the `.00` on the whole number and it truncates the number
with more than 2 decimal places rounding as necessary.
See the [`Intl.NumberFormat`
docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat)
for more details.