Naučite koliko JavaScript funkcije mogu biti fleksibilne i kako ih možete koristiti za stvaranje fleksibilnog koda koji se može ponovno koristiti.

JavaScript je moćan jezik koji podržava većina modernih preglednika i izvrstan je izbor za početnike.

Baš kao i mnogi drugi moderni programski jezici, JavaScript podržava funkcije koje vam omogućuju da izolirate blok koda i ponovno ga upotrijebite negdje drugdje. Također možete upotrijebiti dodjelu funkcija varijablama i proslijediti ih kao parametre, poput drugih vrijednosti.

Što su funkcije višeg reda?

Najjednostavnija definicija funkcije višeg reda je funkcija koja izvodi operacije na drugim funkcijama prihvaćajući ih kao parametre ili vraćajući ih. Funkcije višeg reda intenzivno se koriste u paradigma funkcionalnog programiranja. Ako ste tek počinjem s JavaScriptom, funkcije višeg reda mogu biti malo teške za shvatiti.

Razmotrite sljedeći primjer:

funkcijatransformirati(fn) {
neka niz rezultata = [];

povratakfunkcija (niz) {
za (neka ja = 0; i < array.length; i++) {
resultArray.push (fn (polje[i]))
}

povratak resultArray
}
}

U gornjem bloku koda, transformirati funkcija je funkcija višeg reda koja preuzima fn funkcija kao parametar i vraća anonimnu funkciju koja prima niz kao parametar.

Svrha je transformirati funkcija je modificiranje elemenata u nizu. Prvo, kod definira varijablu resultArray i veže ga za prazan niz.

The transformirati funkcija vraća anonimnu funkciju koja prolazi kroz svaki element niz, zatim prosljeđuje element u fn funkciju za izračunavanje i gura rezultat u resultArray. Nakon završetka petlje, anonimna funkcija vraća resultArray.

konst funkcija1 = transformacija((x) => x * 2)
konzola.log (funkcija1([ 2, 3, 4, 5, 6 ])) /* [ 4, 6, 8, 10, 12] */

Gornji blok koda dodjeljuje anonimnu funkciju koju vraća transformirati funkcija na konstantnu varijablu funkcija1. fn vraća proizvod od x koji je zamjena za niz[i].

Kod također prosljeđuje polje kao parametar funkcija1 a zatim zapisuje rezultat u konzolu. Kraći način pisanja bi bio:

konzola.log (transformacija((x) => x * 2)([ 2, 3, 4, 5, 6 ]))

JavaScript ima ugrađenu funkciju višeg reda koja u osnovi radi isto što i transformirati, o čemu ćemo govoriti kasnije.

Nadamo se da počinjete shvaćati kako funkcioniraju funkcije višeg reda u JavaScriptu. Pogledajte sljedeću funkciju i vidite možete li pogoditi što radi.

funkcijafilterAndTransform(fn, arrayToBeFiltered, uvjet) {
neka filteredArray = [];

za (neka ja = 0; i < arrayToBeFiltered.length; i++) {
ako (uvjet (arrayToBeFiltered[i])) {
neka y = transform (fn)([ arrayToBeFiltered[i] ])[0]
filteredArray.push (y)
} drugo {
filteredArray.push (arrayToBeFiltered[i])
}
}

povratak filtrirani niz
}

Ovaj blok koda definira funkciju koja radi ono što možda sumnjate - provjerava elemente u nizu koji ispunjavaju određeni uvjet i transformira ih s transformirati() funkcija. Da biste koristili ovu funkciju, učinite nešto poput ovoga:

filterAndTransform((x) => x * 2, [ 1, 2, 3, 4, 5 ], (x) => x % 20)

Za razliku od transformirati funkcija, The filterAndTransform funkcija uzima dvije funkcije kao parametre: fn i stanje. The stanje funkcija provjerava je li parametar prošao, je li paran broj i vraća true. U suprotnom, vraća false.

Ako stanje razrješava na true (uvjet je ispunjen), tek tada je transformirati funkcija tzv. Ova logika bi mogla biti korisna ako radite s nizom i želite transformirati određene elemente. Ako pokrenete ovaj kod u konzoli preglednika, trebali biste dobiti sljedeći odgovor:

[ 1, 4, 3, 8, 5 ]

Možete vidjeti da funkcija transformira samo elemente koji ispunjavaju određeni uvjet, ostavljajući elemente koji ne ispunjavaju uvjet kakvi jesu.

Array.map() funkcija višeg reda u JavaScriptu

Metode polja poput map() su funkcije višeg reda koje olakšavaju manipuliranje nizovima. Evo kako to radi.

neka niz = [ 1, 2, 3, 4, 5 ];
neka transformedArray = array.map((x) => x * 2);

Kada se prijavite transformirani niz u konzoli preglednika, trebali biste dobiti isti rezultat koji ste dobili s transformirati ranije spomenuta funkcija:

[ 2, 4, 6, 8, 10 ]

niz.map() ima dva parametra, prvi parametar se odnosi na sam element, dok se drugi parametar odnosi na indeks elementa (poziciju u nizu). Sa samo niz.map() možete postići iste rezultate kao filterAndTransform funkcija. Evo kako ćete to učiniti:

neka niz = [ 1, 2, 3, 4, 5 ];
neka transformedArray = array.map((x) => x % 20? x * 2: x);

U gornjem bloku koda, funkcija vraća umnožak trenutnog elementa i 2, ako je element paran. U suprotnom, vraća element netaknut.

S ugrađenim karta uspjeli ste eliminirati potrebu za nekoliko redaka koda, što je rezultiralo mnogo čišćim kodom i manje šanse za pojavu grešaka.

Funkcija Array.filter() u JavaScriptu

Kada prizovete filtar metodu na nizu, provjerite je li povratna vrijednost funkcije koju prosljeđujete metodi istinita ili lažna. The filtar metoda vraća niz koji sadrži elemente koji zadovoljavaju uvjet koji je proslijeđen. Evo kako ga možete koristiti.

funkcijaprovjeriPrvoslovo(riječ) {
neka samoglasnici = "aeiou"

ako (samoglasnici.uključuje(riječ[0].u mala slova())) {
povratak riječ;
} drugo {
povratak;
}
}

neka riječi = [ "Zdravo", "iz", "the", "djeca", "od", "planeta", "Zemlja" ];
neka rezultat = riječi.filter((x) => provjeriPrvo slovo (x))

Gornji blok koda prolazi kroz riječi niz i filtrira sve riječi čije je prvo slovo samoglasnik. Kada pokrenete kôd i prijavite se proizlaziti varijable, trebali biste dobiti sljedeće rezultate:

[ 'od', 'Zemlja' ];

Funkcija Array.reduce() u JavaScriptu

The smanjiti() funkcija višeg reda ima dva parametra. Prvi parametar je redukcijska funkcija. Ova redukcijska funkcija odgovorna je za kombiniranje dviju vrijednosti i vraćanje te vrijednosti. Drugi parametar nije obavezan.

Definira početnu vrijednost koja se prosljeđuje funkciji. Ako želite vratiti zbroj svih elemenata u nizu, možete učiniti sljedeće:

neka a = [ 1, 2, 3, 4, 5];
neka zbroj = 0;

za (neka ja = 0; i < a.duljina; i++) {
zbroj = zbroj + a[i];
}

konzola.log (zbroj);

Ako pokrenete kod, iznos treba biti 15. Također možete uzeti drugačiji pristup s smanjiti funkcija.

neka a = [ 1, 2, 3, 4, 5 ];
zbroj = a.reduce((c, n) => c + n);
konzola.log (zbroj);

Gornji blok koda mnogo je čistiji u usporedbi s ranijim primjerom. U ovom primjeru funkcija redukcije uzima dva parametra: c i n. c odnosi se na trenutni element dok n odnosi se na sljedeći element u nizu.

Kada se kôd pokrene, funkcija reduktora prolazi kroz niz, pazeći da doda trenutnu vrijednost rezultatu iz prethodnog koraka.

Moć funkcija višeg reda

Funkcije u JavaScriptu su moćne, ali funkcije višeg reda podižu stvari na višu razinu. Naširoko se koriste u funkcionalnom programiranju, omogućujući vam filtriranje, smanjivanje i mapiranje nizova s ​​lakoćom.

Funkcije višeg reda mogu vam pomoći u pisanju više modularnog koda koji se može ponovno koristiti prilikom izrade aplikacija.