-1

Is it because we want to run this function in loop? or anything else? (This is the code for display of multiple texts with fade in and out effects.)

HTML Code:

<div class="container">
  <h2 class="quotes">first quote</h2>
  <h2 class="quotes">second quote</h2>
  <h2 class="quotes">3rd quote</h2>
  <h2 class="quotes">4th quote</h2>
  <h2 class="quotes">5th quote</h2>
  <h2 class="quotes">6th quote</h2>
</div>

CSS Code:

.quotes {display: none;}

JS Code:

(function() {

  var quotes = $(".quotes");
  var quoteIndex = -1;

  function showNextQuote() {
    ++quoteIndex;
    quotes.eq(quoteIndex % quotes.length)
      .fadeIn(2000)
      .delay(2000)
      .fadeOut(2000, showNextQuote);
  }

  showNextQuote();

})();
  • 2
    see: [IIFE (Immediately Invoked Function Expression)](https://developer.mozilla.org/en-US/docs/Glossary/IIFE) – pilchard May 01 '21 at 21:16

1 Answers1

3

It means that the function will invoke immediately without you calling the it.

See -> https://scriptverse.academy/tutorials/js-self-invoking-functions.html

Edit:
as Felix Kling mentioned
to be clear: you do call it but you calling as soon as the function defined unlike normal functions that can be called on events or as callbacks

amir
  • 196
  • 9
  • *"without you calling the it"* It is called. That's what the `()` at the end mean. It's the same as `foo()` except that `foo` is replaced with a function definition. – Felix Kling May 01 '21 at 22:23