What are the different use cases of remainder operator (%) in JavaScript?

In this tutorial, we will see the different use cases of the remainder operator (%). The % operator is also known as the modulo operator. This operator returns the remainder when a number is divided by the second. It takes the sign of the dividend.

What is Remainder?

From the division formula dividend / divisor = quotient quotient. When the dividend is not completely divisible by the divisor then there is always a remainder. So, in case our quotient is an integer then our remainder will always be zero.

For example

10 / 2= 5 here no remainder is there as 10 is completely divisible by 5.
6 / 4 = 1 here reminder is 2 as 6 is not completely divisible by 4.

So, we got to know about the remainder, now also remember that remainder is something that the remainder operator returns, and it works on methods like dividend % divisor.

Example 1

In the below example, we find the remainder for different use cases.

<!DOCTYPE html>
<html>
<head>
   <title>Remainder Operator (%) Use cases</title>
</head>
<body>
   <div id = "output"> </div>
   <script>
   var outDiv = document.getElementById("output")
   var remainder;
   
   //when dividend >= divisor
   remainder = 10 % 4;
   outDiv.innerHTML += remainder + "<br>" // 2
   
   remainder = -10 % 4
   outDiv.innerHTML += remainder + "<br>" // 2 // -2
   
   remainder = 10 % -4
   outDiv.innerHTML += remainder + "<br>" // 2
   
   remainder = -10 % -4
   outDiv.innerHTML += remainder + "<br>"// -2
   
   //when dividend <= divisor
   remainder = 4 % 10
   outDiv.innerHTML += remainder + "<br>"
   
   remainder = -4 % 10
   outDiv.innerHTML += remainder + "<br>"
   
   remainder = 4 % -10
   outDiv.innerHTML += remainder + "<br>" // 4
   
   remainder = -4 % -10
   outDiv.innerHTML += remainder + "<br>" // -4
   
   //remainder when NaN (Not a Number) is dividend
   remainder = NaN % -2
   outDiv.innerHTML += remainder + "<br>" // NaN
   //so, when NaN is divided by and value then output will always be NaN.
   
   //remainder when infinity is dividend
   remainder = Infinity % 4
   outDiv.innerHTML += remainder + "<br>" // NaN
   
   remainder = Infinity % 0
   outDiv.innerHTML += remainder + "<br>" // NaN
   
   remainder = Infinity % Infinity
   outDiv.innerHTML += remainder + "<br>"// NaN
   
   // when float value is divided
   remainder = 4.5 % 3
   outDiv.innerHTML += remainder + "<br>" // 1.5
   
   remainder = -4.5 % 3
   outDiv.innerHTML += remainder + "<br>"// -1.5

   remainder = 3 % -4.5
   outDiv.innerHTML += remainder + "<br>" // 3
   </script>
</body>
</html>

Example 2

Checking Even and Odd numbers

We use the remainder operator to check if the entered number is even or odd. We find the remainder when the number is divided by 2. If the remainder is 0, then the number is even else if the remainder is 1 then the number is odd.

<!DOCTYPE html>
<html>
<body>
   <h1>JavaScript reminder operator:</h1>
   <input type="number" id="val" placeholder="Enter a number" />
   <input type="button" value="Check" onclick="checkOddEven()" style="color: blue"/>
   <h4 id="writeHere"></h4>
   <script>
      function checkOddEven(){
         var val=document.getElementById("val").value
         if(val%2===0)
            document.getElementById('writeHere').innerHTML= val + " is even"
         else
            document.getElementById('writeHere').innerHTML=val + " is odd"
      }
   </script>
</body>
</html>

What is the difference between remainder and modulo?

Sometimes many of you have confusion regarding modulo and remainder operator. So let’s make it clear.

In some languages like python, C++ % represents modulo. Like we use it to avoid overflow or being inside our range of the data type. But in the case of JavaScript % alone doesn’t mean modulo operator. In some cases, like when divisor and divisor have the same sign then in that case modulo can return the same value as the remainder.

Example

in case remainder 7%4 = 3
In modulo 7%4 = 3

You can see both are giving the same result, let’s take using a negative sign

In case remainder -7%4= -3
In modulo -7%4 = 1

Using the above example, you can observe that in case sign change modulo will give a different result than the remainder.

In JavaScript we calculate the modulo using the formula mentioned below

((dividend % divisor) + divisor) % divisor

Updated on: 16-Aug-2022

323 Views

Related Articles

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements