Round a number to 2 decimal places in JavaScript

In this article, you’ll learn how to Round a number to 2 decimal places in JavaScript. For this we will use two in-built methods in JavaScript namely toPrecision() and toFixed() methods.

Also, we use parseFloat() function which returns a floating-point number.

Now let’s see how it happen…

But before we move on, we should know the logic of rounding the number.

Logic:

  1. Look at 2 decimal places after the decimal point.
  2. Then see the next digit.
  3. If next digit >=5, then increase value of last/previous digit by one.
  4. If next digit <5, then it is same as last digit.
  5. Ignore all digits after next digit.

parsefloat() method

If we are passing any string or any number as argument inside this method so what will happen inside it,

If it is in the number format, it converts to float format.

Here, that is in the floating point.

The value of the floating point comes in decimal.

NOTE:

  •  It returns NaN( not a number) if it is found first character of string is not a number
 or it doesn’t contain any number in the whole string.
  • It returns floating point only when it is found first character of string is a number.
  • It ignores spaces

For example,

<script>  

  // returns floating point 
  var a = parseFloat("234.67923");
  document.write(a +"<br>");

  // returns only first number
  var b = parseFloat("20 23 56");
  document.write(b +" <br>");
  
  // returns NaN
  var c = parseFloat("codespeedy123");
  document.write(c);

</script

OUTPUT:

234.67923
20
NaN

toPrecision() method

Used to convert a number to a specified length with rounding the result.

It’s return value is string.

Decimal point and NULL are added if necessary.

Syntax:

variable_name.toPrecision(x);

where, x: number of digit that’s we want to round up.

If we have to round up 2 decimal places using this method,

We take number of digit 4

Because, it’s count starts from before decimal point.

Our Code:

<script> 
     var a = parseFloat("24.67923"); 
     document.write(a.toPrecision(2) +"<br>"); 

     var b = parseFloat("20.2");
     document.write(b.toPrecision(4) +" <br>"); 
     
     var c = parseFloat("20.2567");
     document.write(c.toPrecision(4) +" <br>"); 

     var c = parseFloat("0.002345");
     document.write(c.toPrecision(4));
</script>

OUTPUT:

25
20.20
20.26
0.002345

As you can clearly see in the last output it’s count start from non zero digit before decimal point.

Due to this drawback, we couldn’t get the result that we wanted.

Hence we mostly use tofixed() method.

toFixed() method

It converts any number into string.

Specifies how many decimal places that we are needed after the decimal point also round up the number.

It’s count starts after decimal point.

Syntax:

variable_name.tofixed(x)

x: number of digits after decimal point.

Note: Default It Is Zero.

Right now, here we needed two decimal places after decimal point.

For this we will write,

variable_name.tofixed(2)

Here is Our Code:

<script> 

     var a = parseFloat("20.2");
     document.write(a.toFixed(2) +" <br>"); 
     
     var b = parseFloat("20.2567");
     document.write(b.toFixed(2) +" <br>"); 

     var c = parseFloat("0.002345");
     document.write(c.toFixed(2));

</script>

OUTPUT:

20.20
20.26
0.00

Also Read:

How to replace all occurrences of a string in JavaScript

How to change font size using JavaScript

Leave a Reply

Your email address will not be published. Required fields are marked *