Zistite, aké flexibilné môžu byť funkcie JavaScriptu a ako ich môžete použiť na vytvorenie flexibilného, opakovane použiteľného kódu.
JavaScript je výkonný jazyk podporovaný väčšinou moderných prehliadačov a je to skvelá voľba pre začiatočníkov.
Rovnako ako mnoho iných moderných programovacích jazykov, aj JavaScript podporuje funkcie, ktoré vám umožňujú izolovať blok kódu a znova ho použiť niekde inde. Môžete tiež použiť priradenie funkcií k premenným a odovzdať ich ako parametre, podobne ako iné hodnoty.
Čo sú funkcie vyššieho rádu?
Najjednoduchšia definícia funkcie vyššieho rádu je funkcia, ktorá vykonáva operácie s inými funkciami tak, že ich akceptuje ako parametre alebo ich vracia. Funkcie vyššieho rádu sa vo veľkej miere používajú v paradigma funkčného programovania. Ak ste práve začínate s JavaScriptom, funkcie vyššieho rádu môžu byť trochu ťažké pochopiť.
Zvážte nasledujúci príklad:
funkciutransformovať(fn) {
nech vysledokPole = [];vrátiťfunkciu (pole) {
pre (nech i = 0; i < pole.dĺžka; i++) {
resultArray.push (fn (pole[i]))
}
vrátiť výsledokPole
}
}
Vo vyššie uvedenom bloku kódu je transformovať funkcia je funkcia vyššieho rádu, ktorá preberá funkciu fn funguje ako parameter a vracia anonymnú funkciu, ktorá preberá pole ako parameter.
Účelom transformovať funkcia je modifikovať prvky v poli. Najprv kód definuje premennú výsledokPole a naviaže ho na prázdne pole.
The transformovať funkcia vracia anonymnú funkciu, ktorá prechádza každým prvkom v pole, potom odovzdá prvok do fn funkciu pre výpočet a vloží výsledok do výsledokPole. Po dokončení cyklu anonymná funkcia vráti výsledokPole.
konšt funkcia1 = transformácia((X) => X * 2)
konzoly.log (funkcia1([ 2, 3, 4, 5, 6 ])) /* [ 4, 6, 8, 10, 12] */
Vyššie uvedený blok kódu priraďuje anonymnú funkciu vrátenú serverom transformovať funkcie na konštantnú premennú funkcia1. fn vráti produkt z X ktorý je náhradou za pole[i].
Kód tiež odovzdá pole ako parameter funkcia1 a potom zaznamená výsledok do konzoly. Kratší spôsob písania by bol:
konzoly.log (transform((X) => X * 2)([ 2, 3, 4, 5, 6 ]))
JavaScript má zabudovanú funkciu vyššieho rádu, ktorá v podstate robí to isté ako transformovať, ktorému sa budeme venovať neskôr.
Dúfajme, že začínate chápať, ako fungujú funkcie vyššieho rádu v JavaScripte. Pozrite sa na nasledujúcu funkciu a zistite, či dokážete uhádnuť, čo robí.
funkciufilterAndTransform(fn, arrayToBeFiltered, podmienka) {
nech filterArray = [];pre (nech i = 0; i < arrayToBeFiltered.length; i++) {
ak (stav (arrayToBeFiltered[i])) {
nech y = transformácia (fn)([ arrayToBeFiltered[i] ])[0]
filterArray.push (y)
} inak {
filterArray.push (arrayToBeFiltered[i])
}
}
vrátiť filterArray
}
Tento blok kódu definuje funkciu, ktorá robí to, čo by ste mohli mať podozrenie – kontroluje prvky v poli, ktoré spĺňajú určitú podmienku, a transformuje ich pomocou transformovať () funkciu. Ak chcete použiť túto funkciu, postupujte takto:
filterAndTransform((X) => X * 2, [ 1, 2, 3, 4, 5 ], (x) => x % 20)
Na rozdiel od transformovať funkcia, The filterAndTransform funkcia berie ako parametre dve funkcie: fn a stave. The stave funkcia skontroluje, či parameter prešiel, či je párne číslo a vráti hodnotu true. V opačnom prípade vráti hodnotu false.
Ak stave vyhodnotí ako true (podmienka je splnená), až potom je transformovať volaná funkcia. Táto logika sa môže hodiť, ak pracujete s poľom a chcete transformovať určité prvky. Ak tento kód spustíte v konzole prehliadača, mali by ste dostať nasledujúcu odpoveď:
[ 1, 4, 3, 8, 5 ]
Môžete vidieť, že funkcia transformuje iba prvky, ktoré spĺňajú určitú podmienku, pričom prvky, ktoré nespĺňajú podmienku, ponechá tak, ako sú.
Funkcia vyššieho rádu Array.map() v JavaScripte
Metódy poľa ako map() sú funkcie vyššieho rádu, ktoré uľahčujú manipuláciu s poľami. Tu je návod, ako to funguje.
nech pole = [ 1, 2, 3, 4, 5 ];
nech transformedArray = array.map((X) => X * 2);
Keď sa prihlásite transformedArray v konzole prehliadača by ste mali dostať rovnaký výsledok, aký ste dostali s transformovať funkcia uvedená vyššie:
[ 2, 4, 6, 8, 10 ]
array.map() má dva parametre, prvý parameter odkazuje na samotný prvok, zatiaľ čo druhý parameter odkazuje na index prvku (pozícia v poli). S práve array.map() môžete dosiahnuť rovnaké výsledky ako filterAndTransform funkciu. Urobíte to takto:
nech pole = [ 1, 2, 3, 4, 5 ];
nech transformedArray = array.map((X) => X % 20? X * 2: X);
V bloku kódu vyššie funkcia vráti súčin aktuálneho prvku a 2, ak je prvok párny. V opačnom prípade vráti prvok nedotknutý.
So vstavaným mapa sa vám podarilo eliminovať potrebu niekoľkých riadkov kódu, čo vedie k oveľa čistejšiemu kódu a menšej pravdepodobnosti výskytu chýb.
Funkcia Array.filter() v JavaScripte
Keď vyvoláte filter metóde na poli, uistite sa, že návratová hodnota funkcie, ktorú odovzdávate do metódy, je buď true alebo false. The filter metóda vracia pole obsahujúce prvky, ktoré spĺňajú podmienku. Tu je návod, ako ho používate.
funkciucheckFirstLetter(slovo) {
nech samohlásky = "aeiou"ak (samohlásky.zahŕňa(slovo[0].na malé písmená())) {
vrátiť slovo;
} inak {
vrátiť;
}
}
nech slová = [ "Ahoj", "od", "ten", "deti", "z", "planéta", "Zem" ];
nech vysledok = slova.filter((X) => checkFirstLetter (x))
Blok kódu vyššie prechádza cez slová pole a filtruje každé slovo, ktorého prvé písmeno je samohláska. Keď spustíte kód a prihlásite sa výsledok premennej, mali by ste získať nasledujúce výsledky:
[ 'z', 'Zem' ];
Funkcia Array.reduce() v JavaScripte
The znížiť () funkcia vyššieho rádu má dva parametre. Prvým parametrom je redukčná funkcia. Táto redukčná funkcia je zodpovedná za spojenie dvoch hodnôt a vrátenie tejto hodnoty. Druhý parameter je voliteľný.
Definuje počiatočnú hodnotu, ktorá sa má odovzdať funkcii. Ak chcete vrátiť súčet všetkých prvkov v poli, môžete urobiť nasledovné:
nech a = [ 1, 2, 3, 4, 5];
nech suma = 0;pre (nech i = 0; i < a.dĺžka; i++) {
súčet = súčet + a[i];
}
konzoly.log (súčet);
Ak spustíte kód, súčet malo by byť 15. Môžete tiež použiť iný prístup s znížiť funkciu.
nech a = [ 1, 2, 3, 4, 5 ];
súčet = a.znížiť((c, n) => c + n);
konzoly.log (súčet);
Vyššie uvedený blok kódu je oveľa čistejší v porovnaní s predchádzajúcim príkladom. V tomto príklade má funkcia redukcie dva parametre: c a n. c odkazuje na aktuálny prvok while n odkazuje na ďalší prvok v poli.
Keď sa kód spustí, funkcia redukcie prechádza poľom a uistite sa, že pridáte aktuálnu hodnotu k výsledku z predchádzajúceho kroku.
Sila funkcií vyššieho rádu
Funkcie v JavaScripte sú výkonné, ale funkcie vyššieho rádu posúvajú veci na ďalšiu úroveň. Sú široko používané vo funkčnom programovaní, umožňujú vám ľahko filtrovať, zmenšovať a mapovať polia.
Funkcie vyššieho rádu vám môžu pomôcť napísať modulárnejší a opakovane použiteľný kód pri vytváraní aplikácií.