How to check two numbers are approximately equal in JavaScript?


In this tutorial, we will check if two numbers are approximately equal or not. In case given two numbers are equal then we will print yes, it is otherwise not it’s not.

But let me make you clear that we are not going to do any magic here, basically we will also have to give an epsilon value.

So, when we calculate the absolute difference between those two numbers and then compare with the epsilon then if absolute difference is lesser than the epsilon then the numbers are approximately equal else not approximately equal.

Suppose two numbers given is 6.79 and 6.75 and epsilon as 0.05 so we calculate absolution difference first which will come out as abs (6.79-6.75)=0.04 which is lesser then the epsilon value so number is approximately equal.

You might be thinking why absolute?

So, this is in case first value from which we are subtracting is minimum and value which we are subtracting is minimum then in that case difference will be negative and it will not give desired output. so, by taking absolute we can get rid of this issue.

Let’s take some example

Input:
   Value1= 2.03
   Value2= 2.01
   Epsilon= 0.01
Output:
   Approximately NOT equal

As when we calculate the absolute difference between both the numbers it will be 0.02 and epsilon value given is 0.01 so our absolute difference is greater than the epsilon value so it’s not approximate equal.

Syntax

Following is the syntax/ pseudocode to check if two numbers are approximately equal −

Const difference= Math.abs(val1-val2);
if(difference<epsilon){
   approximately equal
} else {
   Aapproximately NOT equal
}

Algorithm

  • STEP 1 − Take input two number and epsilon values from the user. Assign these values to variables val1, val2, epsilon respectively.
  • STEP 2 − Compute the absolute difference between the two numbers val1 and val2. Assign this difference to variable difference.
  • STEP 3 − Check if difference is lesser than the epsilon. If true, display proper message saying the two numbers are approximately equal. If false, display the proper message that the numbers are not approximately equal.

Example 1

Let’s embed our function code to HTML code to check real world working. Try entering different numbers and epsilon value to check different cases.

<!DOCTYPE html>
<html>
<body>
   <h1>Approximately Equal?</h1>
   <input type="number" id="val1" placeholder="Enter number1.." /><br><br>
   <input type="number" id="val2" placeholder="Enter number2.." /><br><br>
   <input type="number" id="epsilon" placeholder="Enter max epsilon.." /><br><br>
   <input type="button" value="IsEqual?" onClick="checkIf_approx_equal()" style="color: blue; margin-left: 35px;"/>
   <h2 id="writeHere"></h2>
   <script>
      function checkIf_approx_equal(){
         var val1=document.getElementById("val1").value
         var val2=document.getElementById("val2").value
         var epsilon=document.getElementById("epsilon").value
         var difference= Math.abs(val1-val2);
         console.log(difference)
         if(difference<epsilon){
            document.getElementById('writeHere').innerHTML="Yes Approximately Equal"
         } else {
            document.getElementById('writeHere').innerHTML="No Approximately NOT Equal"
         }
      }
   </script>
</body>
</html>

We can also define our epsilon suppose in case user don’t want to give any epsilon value then we must take a value of epsilon and check if user has entered both of the values or not as it’s necessary to give both the numbers.

Example 2

In the program bellow, we check if the numbers are approximately equal or not. We optimized out code to display messages if user doesn’t enter any or both numbers.

<!DOCTYPE html>
<html>
<body>
   <h1>Approximately Equal?</h1>
   <input type="number" id="val1" placeholder="Enter number1.." /><br><br>
   <input type="number" id="val2" placeholder="Enter number2.." /><br><br>
   <input type="number" id="epsilon" placeholder="Enter max epsilon.." /><br><br>
   <input type="button" value="IsEqual?" onClick="checkIf_approx_equal()" style="color: blue; margin-left: 35px;"/>
   <h2 id="writeHere"></h2>
   <script>
      function checkIf_approx_equal(){
         var val1=document.getElementById("val1").value
         var val2=document.getElementById("val2").value
         var epsilon=document.getElementById("epsilon").value

         if(!val1){
            document.getElementById('writeHere').innerHTML="Please enter a value in first Box"
            return;
         }
         if(!val2){
            document.getElementById('writeHere').innerHTML="Please enter a value in second Box"
            return;
         }
         if(!epsilon) epsilon=1.5

         var difference= Math.abs(val1-val2);
         console.log(difference)
         if(difference<epsilon){
            document.getElementById('writeHere').innerHTML="Equal"
         } else {
            document.getElementById('writeHere').innerHTML="Not Equal"
         }
      }
   </script>
</body>
</html>

Please check with different values of number 1 and number 2. Try checking without entering any or both numbers. As we have given default value in epsilon as 1.5 in case user will not enter so it will work using that value.

So, we saw the method to check two numbers are approximately equal or not.

Updated on: 26-Jul-2022

466 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements