Funkcije JavaScript

Funkcije JavaScripta so sposobne več kot zgolj obkrožiti šifro kod, medtem ko čakajo na izvedbo klica. Funkcije so se sčasoma razvile, kar vodi do novih definicij, metod izvajanja in skladenj. Ta objava bo zajemala nekatere sedanje vloge, ki so jih do sedaj igrale funkcije JavaScript.

Poznavanje različnih načinov izražanja in definiranja funkcij odpira možnost uresničevanje logike na bolj optimalen način v JavaScriptu. Prav tako boste lažje odgovorili na vprašanja za intervju.

Funkcijski izrazi

Ko preprosto navedete funkcijo z funkcijo ključna beseda, neobvezni parametri in telo kode, a funkcijo deklaracije.

Postavite to izjavo v izraz JavaScript (kot v nalogi ali aritmetičnem izrazu), postane a funkcijo izraz.

// funkcija funkcije function_name () ; // Funkcija izraz var function_name = function () ; 

Med ocenjevanjem so vse JavaScript deklaracije dvignjene (premaknjene v obsegu). Zato pisanje klica funkcije pred deklaracijo funkcije ni v redu (ker bo deklaracija vseeno premaknjena navzgor).

function_name (); // funkcija klic [WORKS] funkcija function_name () ; 

Vendar izrazi funkcij niso dvignjeni, ker funkcije postanejo del izrazov in niso samostojne deklaracije.

function_name (); // funkcijski klic [WON'T WORK] var function_name = function () ; 

Takojšen pozivni izraz izraza (IIFE)

To je funkcijski izraz, katerega koda se izvede takoj (samo enkrat, ko je ovrednotena). Ustvarite ga lahko tako, da preprosto dodate () (sintaksa, uporabljena za klicanje funkcije) takoj za funkcijskim izrazom. Lahko so anonimni (brez imena, s katerim bi lahko klicali).

Spodaj sta dve najpogostejši sintaksi za ustvarjanje IIFE:

(funkcija optional_function_name () // body ()); 

in

(funkcija optional_function_name () // body) (); 

V oklepajih okoli deklaracije funkcije se pretvori v izraz in nato doda () ko pokliče funkcijo. Lahko uporabite druge načine, da ustvarite IIFE, dokler dodate () po funkcijskem izrazu (kot spodaj), toda prednostne metode so zgornja dva.

// Nekateri načini za ustvarjanje funkcije IIFEs! () / *… * / (); + funkcija () / *… * / (); nova funkcija () / *… * /; 

IIFE je idealen za pisanje kode, ki jo je potrebno izvesti samo enkrat, imenovanje, ustvarjanje zaprtij, ustvarjanje zasebnih spremenljivk in drugo. Spodaj je primer uporabe IIFE.

var page_language = (funkcija () var lang; // Koda za pridobitev jezika za vrnitev strani;) (); 

Koda za pridobitev jezika strani se izvede samo enkrat (po možnosti po nalaganju strani). Rezultat se shrani v page_language za kasnejšo uporabo.

Metode

Ko je funkcija lastnost objekta, se imenuje metoda. Ker je funkcija tudi objekt, je funkcija znotraj druge funkcije tudi metoda. Spodaj je primer metode znotraj objekta.

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

The add in sub funkcije so metode izrač predmet.

Zdaj za funkcijo znotraj primera funkcije:

function add (a) return function (b) return a + b; console.log (dodaj (1) (2)); // Izhod je 3 

Vrnjena anonimna funkcija je metoda funkcije add.

Opomba: od parametra (a) funkcije add v zgornjem primeru je na voljo za naslednji poziv funkcijo, ta tip procesa se imenuje currying.

Konstruktorji

Ko dodate novo ključno besedo pred funkcijo in jo pokličete, postane konstruktor, ki ustvarja primerke. Spodaj je primer, kjer se konstruktorji uporabljajo za ustvarjanje primerkov Sadje vrednosti se dodajo vsaki Sadjelastnosti.

funkcija Sadje () var ime, družina; // Znanstveno ime in družina this.getName = function () return name;; this.setName = funkcija (vrednost) name = value; this.getFamily = function () vrne družino;; this.setFamily = funkcija (vrednost) družina = vrednost;  var apple = new Sadje (); apple.setName ("Malus domestica"); apple.setDružina ("Rosaceae"); var orange = novo Sadje (); orange.setName ("Citrus")¢Â ?? orange.setFamily ("Rutaceae"); console.log (orange.getName ()); // "Citrus Ã?  ?? â ?? // "Malus domestica" console.log (orange.getFamily ()); // "Rutaceae" 

Funkcije puščic (standard ES6) [Samo v Firefoxu]

Nova definicija funkcije iz standarda ES6 zagotavlja krajšo skladnjo za funkcijski izraz. Sintaksa je

() => / * telo * / 

Ta vzorčna funkcija:

var sing = function () console.log ('petje…'); 

je enako kot:

var sing = () => console.log ('petje…'); 

Funkcije puščic so anonimne in nimajo svojih to vrednost, to znotraj njega bo isto kot to v priloženi kodi. Prav tako je ne morete spremeniti v konstruktorja z novo ključno besedo.

Koristne so, kadar želite to znotraj funkcije, ki je enaka zunanji in njena krajša sintaksa naredi kodo za funkcijo pisanja znotraj zgoščene funkcije (kot spodaj)

setInterval (funkcija () console.log ('sporočilo'), 1000); 

v

setInterval (() => console.log ('sporočilo'), 1000); 

Funkcije generatorja (standard ES6) [Samo v Firefoxu]

Druga definicija funkcije iz standarda ES6 je funkcija generatorja. Funkcije generatorja so sposobne zaustaviti in nadaljevati njegovo izvajanje. Njegova skladnja je:

funkcija * ime_ funkcije ()  

ali

funkcija * ime_ funkcije ()  

Generatorske funkcije ustvarjajo iteratorje. Iteratorji Naslednji Metoda se nato uporabi za izvrševanje kode znotraj funkcije generatorja, dokler se donos ključna beseda. Po tem, ponavljajoča se vrednost, ki jo identificira donos Ključna beseda se vrne s funkcijo generatorja in izvršitev se ustavi.

Funkcija generatorja se ponovno izvrši, ko. \ T Naslednji do naslednjega donos ključna beseda. Nekoč vse donos Izvedeni izrazi se vrnejo nedoločeno.

Spodaj je preprost primer:

funkcija * generator_func (count) za (var i = 0; i 
Še en primer:
 
funkcija * randomIncrement (i) prinos i + 3; donos i + 5; izkoristek i + 10; izkoristek i + 6;  var itr = randomIncrement (4); console.log (itr.next (). value); // 7 console.log (itr.next (). Value); // 9 console.log (itr.next (). Value); 14 
 
Obstaja tudi a donos * izraz, ki vrednost prenese na drugo funkcijo generatorja
 
funkcija * sadje (sadje) pridelek * veggies (sadje); donos "Grozdje";  funkcija * zelenjava (sadje) pridobi sadje + "in špinača"; daje sadje + "in brokoli"; daje sadje + "in kumare";  var itr = plodovi ("jabolko"); console.log (itr.next (). value); // "Apple and Spinach" console.log (itr.next (). Value); // "Apple in brokoli" console.log (itr.next (). Value); // "Apple in kumara" console.log (itr.next (). Value); // "Grapes" console.log (itr.next (). Value); //nedoločeno 
 
Funkcije generatorja so uporabne, če želite prehoditi vrednosti ena za drugo na želeno točko v kodi, tako da jo začasno ustavite, namesto da bi naenkrat izgledali kot v zanki skozi polje.
 
Zaključek
 
Spodaj sem vključil seznam referenc, kjer boste našli povezave do referenc in člankov, ki so podrobno obravnavani na različne teme posebej. Obe standardni funkciji ES6 trenutno delujeta samo v Firefoxu.
 
Reference
 
Jezik ECMAScript: Funkcije in razredi
 
Takojšen pozivni izraz izraza (IIFE)
 
Osnove generatorjev ES6
 
Funkcije puščice
 
Funkcija - Mozilla Developer Network