Capcanele IIFE în JavaScript

Să analizăm două bucăți de cod.

Prima:

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

console.log(result);

A doua:

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

console.log(result);

Aceste două bucăți de cod sunt practic identice, dar dacă le rulăm - rezultatul va fi diferit. Primul cod va afișa în consolă numărul 3, iar al doilea - numărul 1.

De ce există o astfel de diferență: totul se datorează faptului că într-un caz, la sfârșitul primei linii de cod, lipsește punctul și virgula, iar în al doilea caz - este prezent.

Ați putea întreba: cum se poate, la urma urmei, în JavaScript punctul și virgula la sfârșitul unei instrucțiuni nu este obligatoriu! De fapt, nu este chiar așa. Să înțelegem ce se întâmplă cu adevărat.

Primul cod poate fi rescris astfel:

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

console.log(result); // va afișa 3

Acum devine imediat evident că la un se adaugă rezultatul apelării funcției imediate, adică 2. De aceea, rezultatul final va fi 3.

Dacă după unu punem punct și virgulă, codul va fi perceput de interpretor altfel:

// Prima instrucțiune:
let result = 1;

// A doua instrucțiune:
+function() {
	return 2;
}();

// A treia instrucțiune:
console.log(result); // va afișa 1

Adică atribuirea în variabilă și apelul funcției imediate vor deveni instrucțiuni separate. Și toate din cauza prezenței punctului și virgulei!

Se dovedește că, în acest caz, apelarea funcției imediate nu face practic nimic - doar returnează în nimic numărul 2, care nu afectează în niciun fel variabila result.

Să înțelegem atunci, de ce putem în general să nu scriem punct și virgulă în JavaScript. Să presupunem că avem un astfel de cod fără punct și virgulă:

let result = 1 // în result se va scrie 1
let test = 2   // în test se va scrie 2

Acesta funcționează corect, deoarece interpretorul a pus singur la sfârșitul fiecărei linii punct și virgulă.

Dar uitați-vă la acest cod:

let result = 1
+ 2; // în result se va scrie 3

Acum punctul și virgula la sfârșitul primei linii nu va fi pus automat, deoarece interpretorul înțelege că instrucțiunea din a doua linie este o parte a instrucțiunii din prima linie.

Dar dacă noi înșine punem punct și virgulă - rezultatul va fi cu totul altul:

let result = 1; // în result se va scrie 1
+ 2; // instrucțiunea nu face nimic, dar nici nu va fi eroare

Se dovedește că interpretorul pune singur punct și virgulă, doar dacă următoarea instrucțiune nu face parte din cea anterioară.

Și acum uitați-vă la acest cod:

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

console.log(result);

Într-adevăr, a doua linie - este pur și simplu continuarea instrucțiunii din prima linie și interpretorul nu pune punct și virgulă automat. Tocmai de aceea, dacă noi înșine scriem punct și virgulă la sfârșitul primei linii - rezultatul va fi cu totul altul. Acest lucru ne spune că este mai bine să punem întotdeauna punct și virgulă în locurile necesare, pentru a evita problemele.