Ismerje meg, milyen rugalmasak lehetnek a JavaScript-függvények, és hogyan használhatja őket rugalmas, újrafelhasználható kód létrehozására.
A JavaScript egy erőteljes nyelv, amelyet a legtöbb modern böngésző támogat, és nagyszerű választás kezdőknek.
Csakúgy, mint sok más modern programozási nyelv, a JavaScript is támogatja azokat a funkciókat, amelyek lehetővé teszik egy kódblokk elkülönítését és máshol történő újrafelhasználását. Használhat függvényeket is a változókhoz, és más értékekhez hasonlóan paraméterként adhatja át őket.
Mik azok a magasabb rendű funkciók?
A magasabb rendű függvények legegyszerűbb definíciója egy olyan függvény, amely paraméterként elfogadva vagy visszaadva műveleteket hajt végre más függvényeken. A magasabb rendű funkciókat erősen használják a funkcionális programozási paradigma. Ha te csak most kezdtem el használni a JavaScriptet, a magasabb rendű függvényeket kissé nehéz megérteni.
Tekintsük a következő példát:
funkcióátalakítani(fn) {
hagyja resultArray = [];Visszatérés
funkció (sor) {
számára (hagyja i = 0; i < array.length; i++) {
resultArray.push (fn (tömb[i]))
}
Visszatérés resultArray
}
}
A fenti kódblokkban a átalakítani A függvény egy magasabb rendű függvény, amely a fn függvényt paraméterként, és egy névtelen függvényt ad vissza, amely beveszi sor paraméterként.
A célja a átalakítani funkciója a tömb elemeinek módosítása. Először is, a kód meghatároz egy változót resultArray és egy üres tömbhöz köti.
A átalakítani A függvény egy névtelen függvényt ad vissza, amely minden egyes elemen áthalad sor, majd átadja az elemet a fn függvényt a számításhoz, és az eredményt benyomja resultArray. A ciklus befejezése után az anonim függvény visszaadja a resultArray.
const függvény1 = transzformáció((x) => x * 2)
konzol.log (function1([ 2, 3, 4, 5, 6 ])) /* [ 4, 6, 8, 10, 12] */
A fenti kódblokk hozzárendeli a névtelen függvényt, amelyet a átalakítani függvényt az állandó változóhoz funkció1. fn termékét adja vissza x ami helyettesíti tömb[i].
A kód paraméterként egy tömböt is átad funkció1 majd naplózza az eredményt a konzolra. Ennek rövidebb módja a következő lenne:
konzol.log (transform((x) => x * 2)([ 2, 3, 4, 5, 6 ]))
A JavaScript rendelkezik egy beépített magasabb rendű funkcióval, amely alapvetően ugyanazt teszi, mint átalakítani, amellyel később foglalkozunk.
Remélhetőleg kezdi megérteni, hogyan működnek a JavaScript magasabb rendű függvényei. Vessen egy pillantást a következő funkcióra, és nézze meg, hogy kitalálhatja-e, mit csinál.
funkciófilterAnd Transform(fn, arrayToBeFiltered, feltétel) {
hagyja filteredArray = [];számára (hagyja i = 0; i < arrayToBeFiltered.length; i++) {
ha (feltétel (arrayToBeFiltered[i])) {
hagyja y = transzformáció (fn)([ arrayToBeFiltered[i] ])[0]
filteredArray.push (y)
} más {
filteredArray.push (arrayToBeFiltered[i])
}
}
Visszatérés filteredArray
}
Ez a kódblokk definiál egy függvényt, amely azt teszi, amit feltételezhetsz – ellenőrzi a tömbben azokat az elemeket, amelyek megfelelnek egy bizonyos feltételnek, és átalakítja azokat a transzformáció() funkció. A funkció használatához tegye a következőket:
filterAndTransform((x) => x * 2, [ 1, 2, 3, 4, 5 ], (x) => x % 20)
ellentétben a átalakítani funkció, A filterAnd Transform függvény két függvényt vesz fel paraméterként: fn és feltétel. A feltétel A függvény ellenőrzi, hogy az átadott paraméter páros-e, és igazat ad vissza. Ellenkező esetben hamis értéket ad vissza.
Ha feltétel igazra oldja fel (a feltétel teljesül), csak akkor a átalakítani nevű függvény. Ez a logika jól jöhet, ha tömbbel dolgozik, és bizonyos elemeket szeretne átalakítani. Ha ezt a kódot a böngészőkonzolban futtatja, a következő választ kell kapnia:
[ 1, 4, 3, 8, 5 ]
Látható, hogy a függvény csak azokat az elemeket alakítja át, amelyek megfelelnek egy bizonyos feltételnek, és a feltételnek nem megfelelő elemeket a jelenlegi állapotukban hagyja.
Az Array.map() magasabb rendű függvény a JavaScriptben
Tömb módszerek, például map() magasabb rendű függvények, amelyek megkönnyítik a tömbök kezelését. Íme, hogyan működik.
hagyja array = [ 1, 2, 3, 4, 5 ];
hagyja transformedArray = array.map((x) => x * 2);
Amikor bejelentkezik átalakítottArray a böngészőkonzolban ugyanazt az eredményt kell kapnia, mint a átalakítani korábban említett funkció:
[ 2, 4, 6, 8, 10 ]
array.map() két paramétert vesz fel, az első paraméter magára az elemre, míg a második paraméter az elem indexére (pozíciójára a tömbben) vonatkozik. Csak úgy array.map() ugyanazokat az eredményeket érheti el, mint a filterAnd Transform funkció. Íme, hogyan kell csinálni:
hagyja array = [ 1, 2, 3, 4, 5 ];
hagyja transformedArray = array.map((x) => x % 20? x * 2: x);
A fenti kódblokkban a függvény az aktuális elem és a 2 szorzatát adja vissza, ha az elem páros. Ellenkező esetben érintetlenül adja vissza az elemet.
A beépített térkép funkciót, sikerült kiküszöbölnie a több sornyi kód szükségességét, ami sokkal tisztább kódot eredményez, és kevesebb a hibák előfordulásának esélye.
Az Array.filter() függvény a JavaScriptben
Amikor meghívod a szűrő metódust egy tömbön, győződjön meg arról, hogy a metódusba átadott függvény visszatérési értéke igaz vagy hamis. A szűrő metódus olyan tömböt ad vissza, amely az átadott feltételnek megfelelő elemeket tartalmaz. Íme, hogyan használja.
funkciócheckFirstLetter(szó) {
hagyja magánhangzók = "aeiou"ha (magánhangzók.magába foglalja(szó[0].to LowCase())) {
Visszatérés szó;
} más {
Visszatérés;
}
}
hagyja szavak = [ "Helló", "tól től", "a", "gyermekek", "nak,-nek", "bolygó", "Föld" ];
hagyja eredmény = szavak.filter((x) => checkFirstLetter (x))
A fenti kódblokk bejárja a szavak tömböt, és kiszűr minden olyan szót, amelynek első betűje magánhangzó. Amikor futtatja a kódot és naplózza a eredmény változó esetén a következő eredményeket kell kapnia:
[ 'nak,-nek', 'Föld' ];
Az Array.reduce() függvény a JavaScriptben
A csökkenti() magasabb rendű függvény két paramétert vesz fel. Az első paraméter a redukciós függvény. Ez a redukciós függvény felelős két érték kombinálásáért és az érték visszaadásáért. A második paraméter nem kötelező.
Meghatározza a függvénynek átadandó kezdeti értéket. Ha egy tömb összes elemének összegét szeretné visszaadni, a következőket teheti:
hagyja a = [ 1, 2, 3, 4, 5];
hagyja összeg = 0;számára (hagyja i = 0; i < a.hossz; i++) {
összeg = összeg + a[i];
}
konzol.log (összeg);
Ha lefuttatja a kódot, összeg 15-nek kell lennie. Más megközelítést is alkalmazhat a csökkenteni funkció.
hagyja a = [ 1, 2, 3, 4, 5 ];
sum = a.reduce((c, n) => c+n);
konzol.log (összeg);
A fenti kódblokk sokkal tisztább a korábbi példához képest. Ebben a példában a redukciós függvény két paramétert vesz fel: c és n. c az aktuális while elemre utal n a tömb következő elemére utal.
Amikor a kód fut, a reduktor funkció végigmegy a tömbön, ügyelve arra, hogy az aktuális értéket hozzáadja az előző lépés eredményéhez.
A magasabb rendű funkciók ereje
A JavaScript funkciói erőteljesek, de a magasabb rendű függvények a dolgokat a következő szintre emelik. Széles körben használják a funkcionális programozásban, lehetővé téve a tömbök egyszerű szűrését, kicsinyítését és leképezését.
A magasabb rendű funkciók segítségével modulárisabb és újrafelhasználhatóbb kódokat írhat az alkalmazások építése során.