How to Limit Decimal Places in JavaScript - codingem.com

How to Limit Decimal Places in JavaScript

To limit decimal places in JavaScript, use the toFixed() method by specifying the number of decimal places.

This method:

1. Rounds the number.
2. Converts it into a string.
3. Returns the number as a string.

For instance, let’s round to 2 decimals:

```let pi = 3.1415;
let rounded = pi.toFixed(2);

console.log(rounded);```

Output:

`3.14`

But this is just one way to do it. Also, it has some caveats.

This is a comprehensive guide to rounding values in JavaScript. You will learn how to:

1. Round a number with toFixed() method and its caveats.
2. Round a number using Math.round() function.
3. Create a generic rounding function.

1. Limit Decimal Places Using toFixed() Method

In JavaScript, you can use the built-in toFixed() method to limit the decimal places of a number.

For instance, let’s round a number to 2 decimals:

```let pi = 3.145;
let rounded = pi.toFixed(2);

console.log(rounded);```

Output:

`3.14`

However, sometimes this method does not give accurate results.

For example, let’s round number 1.0005 to 3 decimals. If you are familiar with mathematics, you know this operation should round the number to 1.001. But look what happens with the toFixed() method:

```var n = 1.0005;
n = n.toFixed(3);

console.log(n);```

Output:

`1.000`

It falsely rounds the number down to 1.000 instead of correctly rounding it up to 1.001.

Because of this types of inaccuracies, it’s best to use other methods for rounding in JavaScript.

2. Limit Decimal Places with Math.round() Function

To limit, that is, round a number to n decimal places, use the built-in Math.round() function.

For example, let’s round a number to 2 decimal places.

```var n = 2.781;
var rounded = Math.round(n * 100) / 100;

console.log(rounded);```

Output:

`2.78`

But this approach also has the same caveat as the previous one. Values such as 1.005 get falsely rounded to 1 instead of 1.01.

For example:

```var n = 1.005;
var rounded = Math.round(n * 100) / 100;

console.log(rounded);```

This should produce 1.01 but instead, it returns 1.

`1`

To avoid this issue, use the Number.EPSILON this way:

```var n = 1.005;
var rounded = Math.round((n + Number.EPSILON) * 100) / 100;

console.log(rounded);```

Output:

`1.01`

3. Generic Rounding Function in JavaScript

In the previous example, you learned how to round numbers using Math.round() with number.EPSILON.

But the example only showed you how to round to 2 decimal places.

What if you want to round to n decimal places?

Let’s write a generic rounding function for that with these specifications:

1. To round to 1 decimal, multiply by 10, round, and divide by 10 (10^1).
2. For 2 decimals multiply and divide by 100 (10^2).
3. For n decimals, multiply and divide by 10^n.

Let’s write a generic rounding function and extend the Number.prototype with it. This way you can call .round() on any numeric type in JavaScript.

```Number.prototype.round = function(n) {
const d = Math.pow(10, n);
return Math.round((this + Number.EPSILON) * d) / d;
}```

Example use:

```1.005.round(2) // Returns 1.01
1.22.round(0)  // Returns 1```

Notice how this will also result in problems when rounding numbers close to the built-in floating-point accuracy.

For instance:

`1.32.round(16) // Returns 1.3200000000000003`

Conclusion

Today, you learned how to limit decimal places in JavaScript.

To recap, you can use the .toFixed() method to limit decimal places. But this has some rounding issues. To overcome those, you can use Math.round() with number.EPSILON.

Thanks for reading.

Happy coding!

Further Reading

100 JavaScript Interview Questions

About the Author

Artturi Jalli
I'm an entrepreneur and a blogger from Finland. My goal is to make coding and tech easier for you with comprehensive guides and reviews.