How to Limit Decimal Places in JavaScript

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 pi = 3.141;
let rounded = pi.toFixed(1);

console.log(rounded);

Output:

3.1

But this is just one alternative. Also, it has some caveats.

In this guide, I will show you 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. How to Limit Decimal Places Using toFixed() Method

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

For instance:

let pi = 3.141;
let rounded = pi.toFixed(1);

console.log(rounded);

Output:

3.1

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, this should give 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.

This is where other ways to round numbers in JavaScript are useful.

2. How to Limi 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:

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

console.log(rounded);

Output:

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. Create a Generic Rounding Function

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.

  • If you want to round to 1 decimal, you need to multiply by 10, round, and divide by 10 (10^1).
  • For 2 decimals multiply and divide by 100 (10^2).
  • 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

Share on facebook
Share on twitter
Share on linkedin

Leave a Comment

Your email address will not be published.