JavaScript-funktsioonid

JavaScripti funktsioonid on võimelised rohkem kui lihtsalt piirduma koodikomplektiga, kuni ootab kõne täitmist. Funktsioonid on aja jooksul muutunud, mille tulemuseks on uued definitsioonid, teostusmeetodid ja süntaksid. See postitus katab mõned praegused rollid, mida JavaScript-funktsioonid on siiani mänginud.

Funktsioonide väljendamise ja määratlemise erinevate viiside tundmine avab võimaluse loogika rakendamine optimaalsemal viisil JavaScriptis. Samuti võite kergemini vastata intervjuu küsimustele.

Funktsioonide väljendused

Kui märkate lihtsalt funktsiooni funktsiooni märksõnad, valikulised parameetrid ja koodikeha, see on a funktsiooni deklaratsiooni.

Pange see deklaratsioon JavaScripti väljendisse (näiteks ülesande või aritmeetilise väljenduse puhul), see muutub a funktsiooni väljend.

// Funktsioonide deklaratsiooni funktsioon funktsiooni_nimi () ; // Funktsiooniväljend var funktsioon_nimi = funktsioon () ; 

Hindamise ajal tõstetakse kõik JavaScript-deklaratsioonid üles (tõstetakse ülespoole). Seega kirjutage funktsioonikõne enne funktsiooni deklaratsiooni õigsust (kuna deklaratsioon liigub igal juhul üles).

function_name (); // funktsioonikõne [WORKS] funktsioonifunktsioon_nimi () ; 

Funktsioonide väljendeid aga ei tõsteta, kuna funktsioonid on osa väljenditest ja nad ei ole iseseisvad deklaratsioonid.

function_name (); // funktsioonikõne [WON'T WORK] var funktsiooni_nimi = funktsioon () ; 

Vahetult käivitatud funktsiooni väljendus (IIFE)

See on funktsiooni väljendus, mille kood täidetakse kohe (ainult üks kord, kui seda hinnatakse). Seda saab luua lihtsalt lisades () (süntaks, mida kasutatakse funktsiooni kutsumiseks) kohe pärast funktsiooni avaldamist. Nad võivad olla anonüümsed (nime pole vaja nimetada).

Allpool on kaks kõige levinumat süntaksit IIFE loomiseks:

(funktsioon vabatahtlik_funktsioon_nimi () // keha ()); 

ja

(funktsioon vabatahtlik_funktsioon_nimi () // keha) (); 

Sulgudes funktsioonideklaratsiooni ümber muundatakse see väljendiks ja seejärel lisades () pärast funktsiooni kutsumist. Te saate kasutada muid viise, kuidas luua IIFE-d nii kaua, kui lisate () pärast funktsiooni ekspressiooni (nagu allpool), kuid eelistatud meetodid on eespool nimetatud kaks.

// Mõned viisid IIFE! Funktsiooni loomiseks () / *… * / (); + funktsioon () / *… * / (); uus funktsioon () / *… * /; 

IIFE on ideaalne koodide kirjutamiseks, mis peavad täitma ainult üks kord, nimesidumine, sulgemiste loomine, eramuutujate loomine ja palju muud. Allpool on toodud näide IIFE kasutamisest.

var page_language = (funktsioon () var lang; // kood, et saada lehekülje tagastamise keele keel;) (); 

Koodi lehekülje keele saamiseks kasutatakse ainult üks kord (soovitavalt pärast lehekülje laadimist). Tulemus salvestatakse page_language hilisemaks kasutamiseks.

Meetodid

Kui funktsioon on objekti omadus, nimetatakse seda meetodiks. Kuna funktsioon on ka objekt, on ka funktsioon teise funktsiooni sees. Allpool on näide objekti sees oleva meetodi kohta.

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

The lisama ja alam funktsioonid on arvest objekti.

Nüüd funktsiooni näites funktsiooni jaoks:

function add (a) return function (b) return a + b; console.log (lisa (1) (2)); // Väljund on 3 

Tagastatud anonüümne funktsioon on funktsiooni meetod lisama.

Märkus: kuna parameeter (a) funktsioon lisama ülaltoodud näites on saadaval järgmine funktsiooni kutsumine, seda tüüpi protsessi nimetatakse karri.

Konstruktorid

Kui lisate uus võtmesõna enne funktsiooni käivitamist ja nimetamist, muutub see konstruktoriks, mis loob eksemplare. Allpool on näide, kus konstruktoreid kasutatakse, et luua Puu ja väärtused lisatakse igale Puuomadusi.

funktsioon Puu () var nimi, perekond; // Teaduslik nimi ja perekond this.getName = function () return name;; this.setName = funktsioon (väärtus) name = value; this.getFamily = funktsioon () tagasi perekond;; this.setFamily = funktsioon (väärtus) family = value;  var apple = uus puu (); apple.setName ("Malus domestica"); apple.setFamily ("Rosaceae"); var orange = uus puuviljad (); orange.setName ("Citrus Ã?  ??¢Â? sinensis "); orange.setFamily (" Rutaceae "); console.log (orange.getName ()); //" Citrus Ã?¢Â? sinensis "console.log (apple.getName ()); //" Malus domestica "console.log (orange.getFamily ()); //" Rutaceae " 

Noole funktsioonid (ES6 standard) [Ainult Firefoxis]

Uus funktsiooni määratlus ES6 standardist annab funktsiooni avaldamiseks lühema süntaksi. Süntaks on

() => / * keha * / 

See proovifunktsioon:

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

on sama nagu:

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

Noole funktsioonid on anonüümsed ja ei oma oma seda väärtus, seda sees on sama seda koodis. Samuti ei saa te seda muuta ehitajaga uus märksõna.

Need on kasulikud, kui soovite seda funktsiooni sees, mis on sama kui väljastpoolt, ja selle lühem süntaks muudab kirjutamise koodi funktsiooni lühikeseks (nagu allpool)

setInterval (funktsioon () console.log ('message'), 1000); 

sisse

setInterval (() => console.log ('message'), 1000); 

Generaatori funktsioonid (ES6 standard) [Ainult Firefoxis]

Teine uus funktsioon ES6 standardi funktsioonist on generaatori funktsioon. Generaatori funktsioonid on võimelised peatama ja jätkama selle täitmist. Selle süntaks on:

funktsioon * funktsiooni_nimi ()  

või

funktsioon * funktsiooni_nimi ()  

Generaatori funktsioonid loovad iteraatorid. Iteraator on järgmine seejärel kasutatakse meetodit generaatori funktsioonis oleva koodi täitmiseks kuni saagikus märksõna on saavutatud. Pärast seda, korduv väärtus, mille on tuvastanud saagikus võtmesõna tagastab generaatori funktsioon ja teostamine peatatakse.

Generaatori funktsioon käivitub uuesti, kui järgmine meetodit kutsutakse järgmisele saagikus märksõna on saavutatud. Kui kõik on saagikus väljendatakse, saadakse saadud väärtus määratlemata.

Allpool on lihtne näide:

funktsioon * generator_func (count) jaoks (var i = 0; i 
Järgmine näide:
 
funktsioon * randomIncrement (i) saagis i + 3; saagis i + 5; saagis i + 10; saagis i + 6;  var itr = randomIncrement (4); console.log (itr.next ().) väärtus; // 7 console.log (itr.next ().) Väärtus); // 9 console.log (itr.next ().) Väärtus); / 14 
 
Seal on ka a saagikus * väljendit, mis annab väärtuse üle teisele generaatori funktsioonile
 
funktsioon * puuviljad (puuviljad) saak * köögiviljad (puuviljad); saagikus "Viinamarjad";  funktsioon * köögiviljad (puuviljad) saagi viljad + ja spinat ”; puuvilja saagis + "ja brokkoli"; puuvilja saagikus + "ja kurk";  var itr = puuviljad ("Apple"); console.log (itr.next ().) väärtus; // "Apple ja spinat" console.log (itr.next ().) Väärtus; // "Apple ja brokkoli" console.log (itr.next ().) Väärtus; // "Apple ja kurk" console.log (itr.next ().) Väärtus; // "Viinamarjad" console.log (itr.next ().) Väärtus; // määratlemata 
 
Generaatorifunktsioonid on kasulikud, kui soovid koodi väärtuse muutmiseks ükshaaval, peatades selle, mitte ühest küljest nagu silmus läbi massiivi.
 
Järeldus
 
Olen lisanud allpool toodud viidete nimekirja, kus leiad lingid viidetele ja artiklitele, mis lähevad põhjalikult läbi erinevatel teemadel. Mõlemad ES6 standardfunktsioonid töötavad praegu ainult Firefoxis.
 
Viited
 
ECMAScript keel: funktsioonid ja klassid
 
Vahetult käivitatud funktsiooni väljendus (IIFE)
 
ES6 generaatorite põhitõed
 
Noole funktsioonid
 
Funktsioon - Mozilla arendajavõrk