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

instagram viewer
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.