JavaScript .toFixed() Method with Examples

JavaScript .toFixed() Method with Examples

Overview

In this javascript toFixed method tutorial, we would love to describe how to use the number method called toFixed with new examples.

JavaScript toFixed() method

The JavaScript toFixed () method is used to round( formats ) a number to a fixed notation point or convert the number into a string and its representation of a number with a specified number of decimal points. It returns value as a string.

Syntax:

number.toFixed(n);
Here,
  • The first thing is n is an optional parameter in toFixed function.
  • The second thing is, n is a number of digits after the decimal place to display in the result.

List of Examples of toFixed Methods

Let’s take a look at an example javascript number format one decimal point, two decimal points or without decimal using the toFixed() method in JavaScript.

 var number = 111.123456;

 number.toFixed();
 number.toFixed(1);
 number.toFixed(2);

 //Output
 111
 111.1
 111.12

Source code of this Example

<!DOCTYPE html>
<html>
   <head>
      <title>JavaScript toFixed() Method Example</title>
   </head>
<body>
<button onclick="myFunction()">Click &amp; See Result</button>

<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>

<script>
  function myFunction() {
      var num = 5230.2256545;
      var n = num.toFixed()
      var n1 = num.toFixed(1)
      var n2 = num.toFixed(2)
      document.getElementById("demo").innerHTML = n;
      document.getElementById("demo1").innerHTML = n1;
      document.getElementById("demo2").innerHTML = n2;
  }
</script>

</body>
</html>

Demo of toFixed() javaScript

JavaScript toFixed() Method Example

Value-1 :-

Value-2 :-

Value-3 :-

Note

Assuming you have a decimal number greater than the real number, taps are added to make the desired decimal length.

How can I round a number in JavaScript? .toFixed() returns a string?

Javascript toFixed With and Without Rounding

Let’s take a new example for rounding a number with or without using .toFixed function.

<!DOCTYPE html>
<html>
   <head>
      <title>Javascript tofixed With and Wthout Rounding Example</title>
   </head>
<body>
<button onclick="calFucntion()">Click &amp; See Result</button>
<br><br>
<b>With Round :-</b> <p id="withRound"></p>
<b>Without Round :-</b> <p id="roundValue"></p>

<script>
  function calFucntion() {
    var num = 5285.8556545;
    var withRound = num.toFixed(2);
    var with2Decimals = num.toString().match(/^-?\d+(?:\.\d{0,2})?/)[0];
    document.getElementById("withRound").innerHTML = withRound;
    document.getElementById("roundValue").innerHTML = with2Decimals;
}
</script>

</body>
</html>

Demo

Javascript tofixed With and Wthout Rounding Example

With Round :-

Without Round :-

Let’s see the Examples

var num = 12345.6789;

num.toFixed();       // Returns '12346': note rounding, no fractional part
num.toFixed(1);      // Returns '12345.7': note rounding
num.toFixed(6);      // Returns '12345.678900': note added zeros
(1.23e+20).toFixed(2);  // Returns '123000000000000000000.00'
(1.23e-10).toFixed(2);  // Returns '0.00'
2.34.toFixed(1);        // Returns '2.3'
2.35.toFixed(1);        // Returns '2.4'. Note it rounds up
2.55.toFixed(1);        // Returns '2.5'. Note it rounds down - see warning above
-2.34.toFixed(1);       // Returns -2.3 (due to operator precedence, negative number literals don't return a string...)
(-2.34).toFixed(1);     // Returns '-2.3'

Conclusion

In this tutorial, you have learned how to use javascript .tofixed function with examples

If you have any questions or thoughts to share, use the comment form below to reach us.

Leave a Reply

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