Function Expression
Function Expression
JavaScript'теги функция сыйкырдуу тил структурасы эмес, баалуулуктун өзгөчө түрү.
Биз буга чейин колдонуп келген синтаксис Функция декларациясы деп аталат:
function sayHi() {
alert("Салам");
}
Функцияларды түзүү үчүн Function Expression деп аталган дагы бир синтаксис бар.
Бул синтаксис бизге кандайдыр бир туюнтумдун ортосунда жаңы функция түзүүгө мүмкүндүк берет.
Бул төмөнкүдөй көрүнөт:
let sayHi = function() {
alert("Салам");
};
Бул жерден sayHi өзгөрмөсүнүн мааниге ээ болуп жатканын көрө алабыз, бул функция() сыяктуу жаңы функция түзүлгөн { alert("Hi"); }.
Функцияны түзүү тапшырма туюнтмасынын контекстинде ишке ашкандыктан (= оң жагында), бул Функция туюнтмасы.
Function ачкыч сөзүнөн кийин ат жок экенин эске алыңыз. Функция туюнтмасы үчүн анын жоктугуна жол берилет.
Бул жерде биз аны дароо өзгөрмөгө дайындайбыз, андыктан бул код мисалдарынын мааниси бирдей: "функция түзүңүз жана аны sayHi өзгөрмөсүнө коюңуз".
Биз кийинчерээк кездеше турган татаал кырдаалдарда функцияны дароо түзүүгө жана чакырууга же эч жерде сакталбастан кийинчерээк аткарууга пландаштырууга болот, анонимдүү бойдон калууда.
Функция бул баалуулук
Дагы кайталайлы: функция кандайча түзүлбөсүн, ал баалуулук. Жогорудагы эки мисалда функция sayHi өзгөрмөсүндө сакталат.Биз бул маанини эскертүү менен көрсөтө алабыз:
function sayHi() {
alert("Салам");
}
alert(sayHi); // функциянын кодун чыгарат
Байкасаңыз, акыркы сап функцияны чакырбайт, анткени sayHiден кийин кашаалар жок. Функциянын аталышы анын аткарылышына себеп болгон программалоо тилдери бар, бирок JavaScript алардын бири эмес.
JavaScript'те функция бул маани, ошондуктан биз аны маани катары кабыл алабыз. Жогорудагы код анын баштапкы коду болгон саптын өкүлчүлүгүн көрсөтөт.
Албетте, функция өзгөчө, аны sayHi() деп атасак болот.
Бирок бул дагы эле баалуулук. Демек, биз аны менен башка баалуулуктардагыдай эле иштей алабыз.
Функцияны башка өзгөрмөгө көчүрө алабыз:
функция sayHi() { // (1) түзүү
alert("Салам");
}
let func = Hi de; // (2) көчүрмө
func(); // Салам // (3) чакыруу көчүрмөсү (иштейт)!
sayHi(); // Салам // бул дагы эле иштейт (эмне үчүн эмес)
Келгиле, бул жерде эмне болгонун кененирээк карап көрөлү:
Функция декларациясы (1) функцияны түзүп, аны sayHi аттуу өзгөрмөгө жайгаштырат.
(2) сапта анын маанисин func өзгөрмөсүнө көчүрдүк. Байкасаңыз (дагы) sayHiден кийин эч кандай кашаа жок. Эгерде алар болгон болсо, анда func = sayHi() туюнтмасы sayHi() функциясынын өзүнө эмес, func өзгөрмөсүнө sayHi() чакырылышынын натыйжасын жазмак.
Эми функцияны sayHi() жана func() деп атаса болот.Биринчи сапта sayHi жарыялоо үчүн Функция туюнтмасын колдонсок болот:
let sayHi = function() { // (1) түзүңүз
alert("Салам");
};
let func = салам айт;
// ...
Баары бирдей иштейт.
Эмне үчүн аягында чекит коюлган?
Сизди кызыктырышы мүмкүн: Эмне үчүн Функция туюнтмасында чекиттүү үтүр бар; аягында, бирок Функция Декларациясында эмес:
function sayHi() {
// ...
}
let sayHi = function() {
// ...
};
Жооп жөнөкөй: Функция туюнтмасы бул жерде тапшырма туюнтмасынын ичинде функция(...) {...} катары түзүлөт: sayHi = …; болсун. үтүрлүү чекит ; туюнтумдун аягына коюу сунушталат, ал функциянын синтаксисине кирбейт.
Үтүрлүү чекит ал жерде let sayHi = 5 сыяктуу жөнөкөй тапшырмалар үчүн, ошондой эле функция тапшырмалары үчүн керек.
Кайра чалуу функциялары
Келгиле, функцияны маани катары берүү жана функция туюнтмаларын колдонуу боюнча көбүрөөк мисалдарды карап көрөлү.
Үч параметр менен ask(суроо, ооба, жок) функциясын жазалы:
суроо
Суроо тексти
ооба
Жооп "ооба" болсо, чакыра турган функция
жок
Жооп "Жок" болсо чакыра турган функция
Биздин функция суроо бериши керек жана колдонуучу кандай жооп бергенине жараша yes() же no() деп чалыңыз:
функция суроо (суроо, ооба, жок) {
эгерде (тастыктоо(суроону)) ооба()
башка жок();
}
showOk() {
alert("Сиз макулсуз." );
}
showCancel() {
alert( "Сиз аткарууну жокко чыгардыңыз." );
}
// колдонуу: showOk, showCancel функциялары суроо аргументтери катары өткөрүлөт
ask("Сиз макулсузбу?", showOk, showCance);
Иш жүзүндө мындай функциялар абдан пайдалуу. "Чыныгы" суроо функциясы менен жогорудагы мисалдын ортосундагы негизги айырмачылык, ал ырастоо үчүн жөнөкөй чалууга караганда колдонуучу менен иштешүүнүн татаалыраак ыкмаларын колдонот. Браузерлерде мындай функциялар адатта кооз диалог кутучаларын көрсөтөт. Бирок бул башка окуя.
суроо функциясына showOk жана showCancel аргументтери кайра чалуу функциялары же жөн эле кайра чалуулар деп аталат.
Негизги идея - биз функцияга өтүп, керек болсо, кийинчерээк кайра чакырылышын күтөбүз. Биздин учурда, showOk "ооба" жооп үчүн кайра чалуу болуп калат, ал эми "жок" жооп үчүн showCanceл.
Бул мисалды Функция туюнтмасы аркылуу бир топ кыскараак кайра жаза алабыз:
функция суроо (суроо, ооба, жок) {
эгерде (тастыктоо(суроону)) ооба()
башка жок();
}
суроо(
"Сиз макулсузбу?",
function() { alert("Сиз макул болдуңуз."); },
function() { alert("Сиз аткарууну жокко чыгардыңыз."); }
);
Бул жерде функциялар ask(...) чалуусунун ичинде жарыяланды. Алардын аты-жөнү жок, анонимдүү деп аталат. Мындай функциялар суроодон тышкары жеткиликтүү эмес (анткени алар өзгөрмөлөргө ыйгарылган эмес), бирок бизге дал ушул нерсе керек.
Биздин скриптте пайда болгон окшош код JavaScript рухунда абдан табигый көрүнөт.
Функция - бул "аракетти" билдирген маани
Саптар же сандар сыяктуу кадимки баалуулуктар маалыматтарды билдирет.
Функцияларды, экинчи жагынан, иш-аракеттер катары кароого болот.
Биз аларды өзгөрмөдөн өзгөрмөгө өткөрүп, каалаган убакта иштете алабыз.Функциянын туюнтмасы жана Функция декларациясы
Келгиле, Функция декларациясы менен Функция туюнтмасынын ортосундагы негизги айырмачылыктарды карап көрөлү.
Биринчиден, синтаксис: аларды коддо кантип ажыратса болот.
Функциянын декларациясы: Функция негизги код агымында өзүнчө “функция…” конструкциясы катары жарыяланат.
// Функция декларациясы
функция суммасы(a, b) {
a + b кайтаруу;
}
Функциянын туюнтмасы: башка туюнтма же синтаксис конструкциясынын ичинде түзүлгөн функция. Бул учурда, функция "дайындоо туюнтмасынын" оң жагында түзүлөт =:
// Функция туюнтмасы
сумма = функция(a, b) {
a + b кайтаруу;
};
Функция JavaScript кыймылдаткычы тарабынан түзүлгөндө бир кыйла тымызын айырма болот.
Функция туюнтмасы аткарылуу ага жеткенде түзүлөт жана андан кийин колдонулушу мүмкүн.
Аткаруу агымы дайындоо туюнтмасынын оң жагына жеткенден кийин let sum = function... - ошол учурдан тартып функция түзүлгөн деп эсептелет жана колдонулушу мүмкүн (өзгөрмөлөргө ыйгарылган, чакыртылган ж.б.).
Функция декларациясы менен баары башкача.
Функция декларациясы жарыяланганга чейин чакырылышы мүмкүн.
Башкача айтканда, JavaScript кыймылдаткычы скрипт же код блогун аткарууга даярданганда, алгач андан Функция Декларациясын издейт жана ушундай функциялардын баарын түзөт. Сиз бул процессти "инициализация этабы" деп ойлосоңуз болот.
Бардык Функция Декларациялары иштелип чыккандан кийин гана аткаруу улантылат.
Натыйжада, Функция декларациясы катары түзүлгөн функциялар алардын аныктамаларынан мурун чакырылышы мүмкүн.Мисалы, бул иштейт:
sayHi("Вася"); // Салам, Вася
function sayHi(name) {
alert( `Салам, ${name}` );
}
sayHi функциясы JavaScript кыймылдаткычы скриптти аткарууга даярдап жатканда түзүлгөн жана мындай функция бул скрипттин бүтүндөй көрүнүп турат.
...Эгер ал Функция туюнтмасы болсо, анда бул код катага алып келет:
sayHi("Вася"); // ката!
let sayHi = function(name) { // (*) мындан ары сыйкыр жок
alert( `Салам, ${name}` );
};
Функция туюнтмасы менен жарыяланган функциялар аларды аткарууга жеткенде түзүлөт. Бул жылдызча (*) менен белгиленген сапта гана болот. Өтө кеч.
Функция Декларациясынын дагы бир маанилүү өзгөчөлүгү алардын блоктук масштабы болуп саналат.
Катуу режимде, Функция декларациясы {...} блогунда болгондо, функция блоктун бардык жеринде жеткиликтүү болот. Бирок анын сыртында эмес.
Мисалы, биз аткаруу убагында алган жаш өзгөрмөнүн маанисине жараша Welcome() функциясын жарыялообуз керек деп элестетип көрөлү. Анан келечекте аны колдонууну пландаштырууда.
Эгерде биз Функциянын Декларациясын колдонууга аракет кылсак, ал ойдогудай иштебейт:
let age = prompt("Сен канча жаштасың?", 18);
// шартка жараша функцияны жарыялайбыз
эгерде (жаш < 18) {
Кош келдиңиз() {
alert("Салам!");
}
} башка {
Кош келдиңиз() {
alert("Салам!");
}
}
// ...иштебейт
Кош келдиңиз(); // Ката: саламдашуу аныкталган эмес
Саламдашуу if сыртында көрүнөө үчүн эмне кылса болот?
Туура ыкма - Функция туюнтмасы менен жарыяланган функцияны кабыл алуу жана if сыртында жарыяланган өзгөрмөгө саламдашуу маанисин ыйгаруу, бул бизге керектүү көрүнүштү камсыз кылат.
Бул код күтүлгөндөй иштейт:
let age = prompt("Сен канча жаштасың?", 18);
тосуп алсын;
эгерде (жаш < 18) {
кош келиңиз = function() {
alert("Салам!");
};
} башка {
кош келиңиз = function() {
alert("Салам!");
};
}
Кош келдиңиз(); // азыр баары жакшы
Же шарттуу операторду колдонуу менен аны дагы жөнөкөйлөштүрө алабыз ?:
let age = prompt("Сен канча жаштасың?", 18);
кош келиңиз = (жаш < 18) ?
function() { alert("Салам!"); } :
function() { alert("Салам!"); };
Кош келдиңиз(); // азыр баары жакшы
Функция декларациясын качан колдонуу керек жана Функция туюнтмасын качан колдонуу керек?
Эреже катары, эгер бизге функция керек болсо, биринчи кезекте биз мурун колдонгон Функция декларациясынын синтаксисин карашыбыз керек. Бул бизге кодубузду кантип уюштурууга көбүрөөк эркиндик берет. Ушундай жол менен жарыяланган функциялар жарыяланганга чейин чакырылышы мүмкүн.
Ошондой эле f(…) {…} функциясы сыяктуу функциялар f = function(…) {…} караганда коддо бир аз көбүрөөк көрүнүп турат. Функция декларацияларын көз менен кармоо оңой.
... Бирок, эгерде Функциянын Декларациясы кандайдыр бир себептерден улам бизге туура келбесе, же бизге шарттуу декларация керек болсо (биз муну жогорудагы мисалда карадык), анда Функция туюнтмасын колдонушубуз керек.
Бардыгы
Функциялар баалуулуктар. Алар коддун каалаган жеринде дайындалышы, көчүрүлүшү же жарыяланышы мүмкүн.Эгерде функция негизги код агымында жалгыз оператор катары жарыяланса, анда ал "Функциянын декларациясы" болуп саналат.
Эгерде функция туюнтма бөлүгү катары түзүлгөн болсо, анда ал "Функция туюнтмасы" болуп саналат.
Функциянын декларациялары код блогу аткарылганга чейин иштетилет. Алар бүт блок боюнча көрүнүп турат.
Функция туюнтмасы менен жарыяланган функциялар аткарылуучу жип аларга жеткенде гана түзүлөт.
Көпчүлүк учурларда функцияны жарыялоо керек болгондо, Функциянын декларациясы артыкчылыктуу, анткени функция коддо жарыяланганга чейин көрүнүп турат. Бул бизге кодубузду уюштурууда көбүрөөк ийкемдүүлүктү берет жана жалпысынан аны окууга ыңгайлуу кылат.
Ушунун негизинде Функциянын туюнтмасын Функция декларациясы биздин милдетибизге ылайыксыз болгондо гана колдонушубуз керек. Биз бул бөлүмдө бир нече мындай мисалдарды карап чыктык жана келечекте дагы көптү көрөбүз.