-2

I'm an absolute js novice and I'm self-tought which doesn't make it better. I have the following function and want to understand what exactly the '% 5' does in it.

    $(function() {
      $(".carad" + new Date().getTime() % 5).css("display", "block");
    });
Stephan Bartholomä
  • 1
  • 1
  • 1
    its the modulus operator https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Remainder – cmgchess Feb 19 '22 at 06:57

3 Answers3

0

The % symbol means the "modulo" operator in JavaScript. This operator returns the remainder after division is applied. So here it would return the remainder of whatever Date().getTime() returned. For example, if the function returned a value of 23, the % would take the remainder of 23/5, which is 3.

lizardpeter
  • 89
  • 1
  • 7
0

% sign simply returns the remainder for example 11%5 will return 1 as the answer.Hope you got your answer

Faizan Siddiqui
  • 1
0

% in the programming world means mod which is the remainder of a division. for instance, 11 divided by 5 equals 2 and the remainder is 1. Here are some resources that teach mod in-depth:

MDN Docs

Geekbox

Better Explained

Stackoverflow

That is being said in the code you've provided you are creating a new date object and extracting the time out of it. So basically this code is trying to select a carad class with the remainder of the date. I have attached a code snippet that will help you understand the idea more.

$(function() {
   $(".carad" + new Date().getTime() % 5).css("color", "red");
   $(".display-mod").text("the remainder is " + new Date().getTime() % 5);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1 class="carad0">Hello world 0</h1>
<h1 class="carad1">Hello world 1</h1>
<h1 class="carad2">Hello world 2</h1>
<h1 class="carad3">Hello world 3</h1>
<h1 class="carad4">Hello world 4</h1>
<h1 class="carad5">Hello world 5</h1>
<h1 class="carad6">Hello world 6</h1>

<p class="display-mod"></p>

In short, this code selects a class with a random number.

Note: I've changed the applied styles to emphasize the idea

Mohammed Alwedaei
  • 601
  • 1
  • 7
  • 14
  • You helped me a lot to understand what a remainder is. But in your example - if I don't make a mistake - carad5 an 6 will never be red as there will be never a remainder 5 or 6 . Right? – Stephan Bartholomä Feb 19 '22 at 09:49
  • In your case yes it will never be 5 or 6 – Mohammed Alwedaei Feb 19 '22 at 10:27
  • I'm using this as a random function. But depending on the number of .carad in the list it needs obviously a different number to randomly assign the red color to all .carad in the list. Maybe not the most clever idea to choose randomly a .carad from the list... – Stephan Bartholomä Feb 19 '22 at 10:32
  • If you want to select a random carad class there are many more efficient and possible solutions you could use. – Mohammed Alwedaei Feb 19 '22 at 10:35