Round to the nearest hundredth of a decimal in JavaScript

featured Image

When working with decimal numbers in JavaScript, you may often need to round a number to the nearest hundredth (two decimal places). In this article, we will see different ways we can achieve it in Javascript.

Suppose we have a decimal number 1.87999999997 and we have to round it to 2 decimals so that we get 1.88 as the return value.

To do this we can use two methods in JavaScript:

  1. Math.round()
  2. toFixed()
  3. Using parseFloat() and toFixed()

So, let’s see how to use these two methods with examples to round it to the nearest hundredth of a decimal.

Method 1 : Using Math.round()

The Math.round() method is used to return a value of a number that is rounded to the nearest integer.

console.log(Math.round(2.6898)) // 3

Since Math.round() returns only the nearest integer, in order to get the nearest hundredth of a decimal of a given number, we can follow the steps below.

First, multiply the number by 100 and then divide it by the same value ( here, in this case, it is 100, as we are rounding it off to the nearest hundredth of the decimal). This will give us the resultant rounded off to two decimal places.

Example:

function roundToHundredths(num) {
  return Math.round(num * 100) / 100;
}

let num1 = 1.87999999997;
console.log(roundToHundredths(num1)); // 1.88

Method 2 : Using toFixed()

The toFixed() method in Javascript converts a number to a string. This method also helps us to round off the string to a specific number of decimals.

Syntax:

number.toFixed(x)

x: It specifies the number of decimals we need.

Now, let’s code a function that can round off to the nearest hundredth of the decimal using toFixed().

function roundToHundredth(value){
  return Number(value.toFixed(2));
};

console.log(roundToHundredth(1.8699996666)) // 1.87
console.log(roundToHundredth(2.14259)) // 2.14
console.log(roundToHundredth(3.67628)) // 3.68

Since toFixed() only returns a string, we have used the Number() to convert it back to the data type number.

Method 3: Using parseFloat() and toFixed()

We can also use parseFloat() and toFixed() to round a number to the nearest hundredth in JavaScript.

Example:

function roundToHundredths(num) {
  return parseFloat(num.toFixed(2));
}

let num = 1.234567;

console.log(roundToHundredths(num)); // 1.23

Here, toFixed(2) to convert the number to a string rounded to two decimal places. And, passing the string to parseFloat() converts it back to a number. The parseFloat() will ignore any trailing zeros after the .23 in this case.

So parseFloat(num.toFixed(2)) as a whole rounds the number to the nearest hundredth.

The advantage of this approach is that it avoids explicitly multiplying and dividing by 100 like the previous examples. toFixed() handles the decimal place rounding and parseFloat() converts back to a number.

Rolling Up or Down a Number

The above methods will round to the nearest hundredth. If you always want to round up or down, you can use these approaches:

Always Round Up

Use Math.ceil() to round up to the next integer, then divide by 100:

function roundUpHundredths(num) {
  return Math.ceil(num * 100) / 100; 
}

let num3 = 1.234;
console.log(roundUpHundredths(num3)); // 1.24

Always Round Down

Use Math.floor() to round down to the previous integer, then divide by 100:

function roundDownHundredths(num) {
  return Math.floor(num * 100) / 100;
}

let num4 = 1.236; 
console.log(roundDownHundredths(num4)); // 1.23

Conclusion:

So in conclusion, JavaScript provides some simple methods for rounding decimals to a specified number of places like the nearest hundredth.

Related Posts

featured Image

Get the 10 characters from a string using JavaScript.

Here, in this article we will learn how to get the first 10 character from any string using JavaScript. Here we will be using JavaScript’s String method substring. What is…

Read more
featured Image

Convert date to long date format using JavaScript

In this article we will look into how to convert a date to a long date format using JavaScript. To convert it to a long format we will be using…

Read more
featured Image

Prevent body from scrolling when a modal is opened

Here, in this article, we will learn how to prevent the body from scrolling when a modal or a pop-up is opened using JavaScript. The scroll event is not cancelable….

Read more