Closures en directe functie-aanroep in JavaScript

Zoals je al weet, is het mogelijk om een anonieme functie direct aan te roepen en het resultaat aan een variabele toe te wijzen:

javascriptlet result = function() {
  return '!';
}();

console.log(result); // toont '!'

Vaak wordt een functie die direct wordt aangeroepen, in zo'n geval tussen ronde haakjes gezet, ook al is dit niet strikt noodzakelijk. Dit wordt gedaan zodat meteen duidelijk is dat de functie direct wordt aangeroepen:

javascriptlet result = (function() {
  return '!';
})();

console.log(result); // toont '!'

Laten we nu ervoor zorgen dat het resultaat van de direct aangeroepen functie een anonieme functie is:

javascriptlet func = (function() {
  return function() {
    console.log('!');
  }
})();

func(); // toont '!'

Laten we het zo maken dat de geretourneerde functie in de closure de variabele num opslaat:

javascriptlet func = (function() {
  let num = 1;
  
  return function() {
    console.log(num);
  }
})();

Als we nog num++ toevoegen, dan wordt de functie func een volwaardige teller:

javascriptlet func = (function() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++;
  }
})();

func(); // toont 1
func(); // toont 2
func(); // toont 3
func(); // toont 4
func(); // toont 5