Funkcie JavaScriptu

Funkcie JavaScriptu sú schopné viac než iba priblížiť veľa kódov počas čakania na uskutočnenie hovoru. Funkcie sa postupom času vyvíjajú, čo vedie k novým definíciám, metódam vykonávania a syntaxom. Tento príspevok sa bude zaoberať niektorými súčasnými funkciami, ktoré funkcie JavaScriptu doteraz zohrali.

Znalosť rôznych spôsobov vyjadrovania a definovania funkcií otvára možnosť implementácia logiky optimálnejším spôsobom v jazyku JavaScript. Môžete tiež ľahšie odpovedať na otázky rozhovoru.

Funkčné výrazy

Keď jednoducho uveďte funkciu funkcie kľúčové slovo, voliteľné parametre a telo kódu, je to funkcie vyhlásenie.

Dej túto deklaráciu v jazyku JavaScript (ako v zadaní alebo aritmetický výraz), stáva sa funkcie vyjadrenie.

Funkcia deklarácie funkcie function_name () ; // Funkčný výraz var function_name = function () ; 

Všetky deklarácie jazyka JavaScript sa počas hodnotenia zdvihli (presunuli sa do rozsahu). Preto napíšte funkčné volanie predtým, než bude deklarácia funkcie v poriadku (pretože vyhlásenie bude presunuté hore).

function_name (); // volanie funkcie [WORKS] function function_name () ; 

Funkčné výrazy však nie sú zdvihnuté, pretože funkcie sa stanú súčasťou výrazov a nie sú samostatnými vyhláseniami.

function_name (); // volanie funkcie [NEPOUŽÍVAJTE] var funkcia_služba = funkcia () ; 

Okamžite vyvolaná funkčná expresia (IIFE)

Je to výraz funkcie, ktorého kód sa okamžite vykoná (iba raz, keď sa vyhodnotí). Môžete si ho vytvoriť jednoduchým pridávaním () (syntax používaný na vyvolanie funkcie) hneď za výrazom funkcie. Môžu byť anonymné (žiadny názov, ktorý by ste to mohli nazvať).

Nižšie sú uvedené dve najčastejšie syntaxy na vytvorenie rozhrania IIFE:

(funkcia optional_function_name () // body ()); 

a

(funkcia optional_function_name () // body) (); 

Prekrútenie okolo vyhlásenia funkcie ju prevádza na výraz a potom sa pridá () po vyvolaní funkcie. Môžete použiť iné spôsoby, ako vytvoriť IIFE tak dlho, ako pridáte () po vyjadrení funkcie (ako je uvedené nižšie), ale preferované metódy sú vyššie uvedené dva.

// Niektoré spôsoby vytvorenia funkcie IIFE! () / * ... * / (); + funkcia () / * ... * / (); nová funkcia () / * ... * /; 

IIFE je ideálny pre písanie kódu, ktorý sa musí spúšťať iba raz, vytváranie uzáverov, vytváranie uzáverov, vytváranie súkromných premenných a ďalšie. Nižšie je uvedený príklad použitia IIFE.

var page_language = (funkcia () var lang; // Kód pre získanie jazyka stránky return lang;) (); 

Kód na získanie jazyka stránky sa vykoná iba raz (najlepšie po načítaní stránky). Výsledok je uložený v page_language pre neskoršie použitie.

metódy

Keď je funkcia vlastnosť objektu, nazýva sa jej metódou. Keďže funkcia je tiež objekt, funkcia vnútri inej funkcie je tiež metóda. Nižšie je uvedený príklad metódy vnútri objektu.

var calc = add: funkcia (a, b) return a + b, sub: funkcia (a, b) return a-b console.log (calc.add (1,2)); // 3 konsole.log (calc.sub (80,2)); // 78 

pridať a náhradník funkcie sú metódy calc objekt.

Teraz pre funkciu v rámci príkladu funkcie:

funkcia add (a) návratová funkcia (b) return a + b; console.log (pridať (1) (2)); Výstup je 3 

Vrátená anonymná funkcia je metódou funkcie pridať.

Poznámka: Pretože parameter () funkcie pridať vo vyššie uvedenom príklade je k dispozícii pre nasledujúcu funkciu vyvolanie, tento typ procesu sa nazýva nosnými.

konštruktéri

Keď pridáte Nový kľúčové slovo pred funkciou a zavolajte, stane sa konštruktérom, ktorý vytvára inštancie. Nižšie je príkladom, kde konštruktéri slúžia na vytvorenie inštancií ovocný a hodnoty sa pridajú ku každému ovocnývlastností.

funkcia Ovocie () var meno, rodina; // Vedecký názov a rodina this.getName = function () return name;; this.setName = funkcia (hodnota) name = hodnota; this.getFamily = funkcia () return family;; this.setFamily = funkcia (hodnota) family = hodnota;  var apple = new Ovocie (); apple.setName ("Malus domestica"); apple.setFamily ( "Rosaceae"); var oranžová = nový Ovocie (); orange.setName ("Citrus Ã?  ?? â ??  ?? sinensis "); orange.setFamily (" Rutaceae "); console.log (orange.getName ()); //" Citrus à ??  ?? â ??  ?? sinensis "console.log (apple.getName ()); //" Malus domestica "console.log (orange.getFamily ()); //" Rutaceae " 

Šípové funkcie (štandard ES6) [Iba v prehliadači Firefox]

Nová definícia funkcií zo štandardu ES6 poskytuje kratšiu syntax pre výraz funkcie. Syntax je

() => / * body * / 

Táto vzorová funkcia:

var sing = funkcia () console.log ('spev ...'); 

je to isté ako:

var sing = () => console.log ('spev ...'); 

Šípkové funkcie sú anonymné a nemajú svoje vlastné toto hodnota, toto vnútri bude rovnaká ako toto v priloženom kóde. Tiež nemôžete zmeniť na konštruktor s Nový kľúčových slov.

Sú užitočné, keď chcete toto vo vnútri funkcie, ktorá má byť rovnaká ako vonku a jej kratšia syntax robí kód pre písanie funkcie v rámci funkcie stručné (ako nižšie)

setInterval (funkcia () console.log ('správa'), 1000); 

do

setInterval (() => console.log ('správa'), 1000); 

Funkcie generátora (štandard ES6) [Iba v prehliadači Firefox]

Ďalšou novou definíciou funkcií z ES6 Standard je funkcia generátora. Funkcie generátora sú schopné zastaviť a pokračovať v jeho vykonávaní. Jeho syntax je:

funkcia * názov_funkcie ()  

alebo

funkcia * názov_funkcie ()  

Funkcie generátora vytvárajú iterátory. Iterátor je Ďalšie metóda sa potom používa na vykonanie kódu vo vnútri funkcie generátora až do doby, kedy sa výťažok bolo dosiahnuté kľúčové slovo. Potom sa opakovaná hodnota identifikovaná pomocou výťažok kľúčové slovo sa vráti pomocou funkcie generátora a vykonanie sa zastaví.

Funkcia generátora sa znova vykoná, keď je funkcia Ďalšie metóda sa volá až do nasledujúceho výťažok bolo dosiahnuté kľúčové slovo. Akonáhle všetky výťažok výrazy sa vykonajú, vrátená hodnota sa vráti nedefinovaný.

Nižšie je uvedený jednoduchý príklad:

funkcia * generátor_funk (počet) pre (var i = 0; i 
Tu je ďalší príklad:
 
funkcia * randomIncrement (i) výťažok i + 3; výťažok i + 5; výťažok i + 10; výťažok i + 6;  var itr = randomIncrement (4); console.log (. itr.next () hodnota); // 7 konsole.log (itr.next (). Hodnota); // 9 konsole.log (itr.next (). Hodnota); // 14 
 
Je tu tiež a výťažok * ktorý prenesie hodnotu na inú funkciu generátora
 
funkcia * ovocie (ovocie) výnos * vegetariáni (ovocie); výnos "hrozno";  funkcia * zelenina (ovocie) výnos ovocie + "a špenát"; výnos ovocie + a brokolica; výnos ovocie + "a uhorka";  var itr = ovocie ("Apple"); console.log (. itr.next () hodnota); // "Apple a špenát" console.log (itr.next (). Hodnota); // "Apple a brokolica" console.log (itr.next (). Hodnota); // "Apple a uhorka" console.log (itr.next (). Hodnota); // "hrozna" console.log (itr.next (). Hodnota); // nedefinovaný 
 
Funkcie generátora sú užitočné, ak chcete postupne prechádzať hodnotami jeden po druhom v preferovanom bode kódu, a to pauzou, namiesto toho, aby ste v jednom kroku prechádzali cez pole.
 
záver
 
Priložil som zoznam nižšie uvedených odkazov, kde nájdete odkazy na referencie a články, ktoré sa podrobne venujú rôznym témam. Obe štandardné funkcie ES6 budú v súčasnosti fungovať len vo Firefoxe.
 
Referencie
 
Jazyk ECMAScript: Funkcie a triedy
 
Okamžite vyvolaná funkčná expresia (IIFE)
 
Základy generátorov ES6
 
Funkcie šípok
 
funkcie - Mozilla Developer Network