Úskalia IIFE v JavaScripte

Pozrime sa na dva kúsky kódu.

Prvý:

javascriptlet result = 1
+function() {
  return 2;
}();

console.log(result);

Druhý:

javascriptlet result = 1;
+function() {
  return 2;
}();

console.log(result);

Tieto dva kúsky kódu sú takmer identické, ale ak ich spustíte, výsledok sa bude líšiť. Prvý kód vypíše do konzoly číslo 3, a druhý - číslo 1.

Prečo je tu taký rozdiel: celá vec je v tom, že v jednom prípade na konci prvého riadku kódu chýba bodkočiarka, a v druhom prípade - je prítomná.

Môžete sa opýtať: ako je to možné, veď v JavaScripte bodkočiarka na konci príkazu nie je povinná! V skutočnosti to nie je úplne pravda. Poďme zistiť, čo sa naozaj deje.

Prvý kód môžeme prepísať takto:

javascriptlet result = 1 + function() {
  return 2;
}();

console.log(result); // vypíše 3

Teraz je hneď zrejmé, že k jednotke sa pripočítava výsledok volania funkcie na mieste, teda 2. Preto konečný výsledok bude 3.

Ak však za jednotku umiestnime bodkočiarku, kód bude interpretom pochopený inak:

javascript// Prvý príkaz:
let result = 1;

// Druhý príkaz:
+function() {
  return 2;
}();

// Tretí príkaz:
console.log(result); // vypíše 1

To znamená, že priradenie do premennej a volanie funkcie na mieste sa stanú rôznymi príkazmi. A to všetko kvôli prítomnosti bodkočiarky!

Ukazuje sa, že v tomto prípade volanie funkcie na mieste v podstate nič nerobí - jednoducho vráti číslo 2 do ničoho, ktoré žiadnym spôsobom neovplyvní premennú result.

Poďme sa teda pozrieť, prečo vôbec môžeme v JavaScripte nepísať bodkočiarku. Predpokladajme, že máme takýto kód bez bodkočiarky:

javascriptlet result = 1 // do result sa zapíše 1
let test = 2   // do test sa zapíše 2

Funguje správne, pretože interpret sám umiestnil na koniec každého riadku bodkočiarku.

Ale pozrite sa na takýto kód:

javascriptlet result = 1
+ 2; // do result sa zapíše 3

Teraz sa bodkočiarka na konci prvého riadku neumiestni automaticky, pretože interpret chápe, že príkaz v druhom riadku - to je časť príkazu z prvého riadku.

Ale ak umiestnime bodkočiarku sami - výsledok bude úplne iný:

javascriptlet result = 1; // do result sa zapíše 1
+ 2; // príkaz nič nerobí, ale ani nebude chyba

Ukazuje sa, že interpret sám umiestňuje bodkočiarku, iba ak nasledujúci príkaz nie je súčasťou predchádzajúceho.

A teraz sa pozrite na tento kód:

javascriptlet result = 1
+function() {
  return 2;
}();

console.log(result);

Naozaj, druhý riadok - je jednoducho pokračovaním príkazu z prvého riadku a interpret neumiestňuje bodkočiarku automaticky. Práve preto, ak sami napíšeme bodkočiarku na konci prvého riadku - výsledok bude úplne iný. To hovorí o tom, že najlepšie je vždy umiestniť bodkočiarku na potrebné miesta, aby sa predišlo problémom.