mirror of
https://github.com/jbranchaud/til
synced 2026-01-03 23:28:02 +00:00
Add Format A Decimal To A Fixed Number Of Digits as a JavaScript TIL
This commit is contained in:
@@ -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).
|
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 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)
|
- [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)
|
- [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)
|
- [Formatting Values With Units For Display](javascript/formatting-values-with-units-for-display.md)
|
||||||
- [Freeze An Object, Sorta](javascript/freeze-an-object-sorta.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)
|
- [Generate A V4 UUID In The Browser](javascript/generate-a-v4-uuid-in-the-browser.md)
|
||||||
|
|||||||
52
javascript/format-a-decimal-to-a-fixed-number-of-digits.md
Normal file
52
javascript/format-a-decimal-to-a-fixed-number-of-digits.md
Normal 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.
|
||||||
Reference in New Issue
Block a user