JavaScript-те IIFE тәуекелдері

Екі код фрагментін қарастырайық.

Біріншісі:

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

console.log(result);

Екіншісі:

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

console.log(result);

Бұл екі код фрагменті бір-біріне дерлік ұқсас, бірақ оларды іске қосқанда - нәтиже әртүрлі болады. Бірінші код консольге 3 санын шығарады, ал екіншісі - 1 санын.

Неге мұндай айырмашылық пайда болды: мұның бәрі бірінші жағдайда бірінші жолдың соңында нүктелі үтір жоқ, ал екінші жағдайда - бар.

Сіз сұрай аласыз: бұл қалай болуы мүмкін, әйтеур JavaScript-те команда соңындағы нүктелі үтір міндетті емес! Шын мәнінде бұл толығымен дұрыс емес. Не болып жатқанын нақты анықтайық.

Бірінші кодты былай қайта жазуға болады:

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

console.log(result); // 3 шығарады

Енді бірге функцияны орнында шалу нәтижесі қосылатыны, яғни 2, бірден анық болып тұр. Сондықтан соңғы нәтиже 3 болады.

Егер бірден кейін нүктелі үтір қойылса, онда код интерпретатормен басқаша түсінілетін болады:

javascript// Бірінші команда:
let result = 1;

// Екінші команда:
+function() {
  return 2;
}();

// Үшінші команда:
console.log(result); // 1 шығарады

Яғни айнымалыға тағайындау және функцияны орнында шалу әртүрлі командалар болады. Және бәрі нүктелі үтірдің болуына байланысты!

Белгілі болғандай, бұл жағдайда функцияны орнында шалу ештеңе істемейді - жай ғана 2 санын ешжерге қайтармайды, ол result айнымалысына әсер етпейді.

Онда неге біз JavaScript-те нүктелі үтір қоюды ұмыта аламыз, соны анықтайық. Нүктелі үтірсіз мынадай код болсын:

javascriptlet result = 1 // result-ке 1 жазылады
let test = 2   // test-ке 2 жазылады

Ол дұрыс жұмыс істейді, себебі интерпретатор әр жолдың соңына нүктелі үтірді өзі қойды.

Бірақ мына кодқа назар аударыңыз:

javascriptlet result = 1
+ 2; // result-ке 3 жазылады

Енді бірінші жолдың соңына нүктелі үтір автоматты түрде қойылмайды, себебі интерпретатор екінші жолдағы команда бірінші жолдағы команданың бөлігі екенін түсінеді.

Бірақ егер біз нүктелі үтірді өзіміз қойсақ - нәтиже мүлдем басқаша болады:

javascriptlet result = 1; // result-ке 1 жазылады
+ 2; // команда ештеңе істемейді, бірақ қате де болмайды

Белгілі болғандай, интерпретатор нүктелі үтірді тек келесі команда алдыңғы команданың бөлігі болмаған жағдайда ғана өзі қояды.

Енді мына кодқа назар аударыңыз:

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

console.log(result);

Шынында, екінші жол - бірінші жолдағы команданың жай ғана жалғасы және интерпретатор нүктелі үтірді автоматты түрде қоймайды. Дәл осы себептен, егер біз бірінші жолдың соңына нүктелі үтірді өзіміз қойсақ - нәтиже мүлдем басқаша болады. Бұл мәселелерді болдырмау үшін қажетті жерлерде әрдайым нүктелі үтір қою өте жөн екенін көрсетеді.