A fejlesztőnek nem csak a feladatok elvégzése szükséges, hanem a feladatok hatékonyabb elvégzése is. Manapság számos JavaScript-könyvtár érhető el, amelyek megkönnyítik a változókkal való munkát a fejlesztők számára. Ebben az oktatóanyagban megtanuljuk, hogyan használhatjuk a Lodash könyvtár leggyakoribb funkcióit.
Ha még nem próbáltad a Lodash-t, most itt a pillanat. A Lodash egy kortárs JavaScript segédprogram, amely leegyszerűsíti a tömbök, egész számok, objektumok, szövegek és egyéb adattípusok kezelését.
Segít a különféle objektumokkal való kezelésben, és időt takarít meg, mivel nincs szükség általános módszerek kódolására. A kód tisztább lesz, kevesebb sorral, és minden böngészőben működni fog. Ha még nem használja, alaposan fontolja meg.
A Lodash alkalmazása óriási veszteséget jelent JavaScript-kódbázisaink számára. Ez egy hibamentes és elegáns megoldás a gyakori munkahelyi kihívásokra, és használatával csak olvashatóbbá és kezelhetőbbé válik a kódunk.
Nézzünk meg néhány népszerűbb (vagy nem!) Lodash-funkciót, és fedezzük fel, milyen rendkívül hasznos és gyönyörű ez a könyvtár.
1. _.sortedUniq
Az összes megkettőzött érték nem kerül visszaadásra ezzel az értékkel. Mivel ez csak rendezett tömbökhöz való, ezt főként sebességi okokból használják. Ez csak akkor hasznos, ha nagy tömbről van szó. Ha növelni szeretné a sebességet, rendezze a tömböt, és használjon olyan módszereket, amelyek jobban működnek a rendezett tömbökkel.
A Lodash számos más, ehhez hasonló funkcióval rendelkezik. Megtekintheti a .sortedIndex, .sortedIndexBy, .sortedIndexOf, .sortedLastIndex, .sortedLastIndexBy, .sortedLastIndexOf, .sortedUniq, .sortedUniqBy, .sortedUniqBy, .sortedBUniqBy, .sortedBy .
2. _.csökkenteni
A _.reduce hasonló egy szűrő funkcióhoz. Az egyetlen különbség az, hogy lehetősége van kiválasztani a visszaadott objektum formáját. Ez normális, ha nem érted, amit mondok; van rá példa.
Lényegében egy új objektumot adunk vissza, amely a felhasználókat életkor szerint besorolva tartalmazza, de csak a 18 és 59 év közöttiek számára. Ez a Lodash helper funkció az egyik leggyakrabban használt funkció. Az ES6-ban is benne van. Két tipikus baklövésre is szeretnék rámutatni: ne felejtse el visszaadni az eredményt a függvény végén, és az eredmény alapértelmezett értékét adja meg harmadik paraméterként (itt).
3. _.get és ._set
Ebben az esetben egy kicsit átverem Önt azzal, hogy bemutatok két olyan funkciót, amelyek majdnem ugyanazt a funkciót látják el. A _.get egy tulajdonság értékét adja vissza egy objektumtól, a _.set pedig, hát, kitaláltad, beállít egy tulajdonságot értékkel. Semmi egyedi, kivéve, hogy egy ingatlanhoz az útvonalán keresztül hozzáférhet.
Nézzünk egy példát.
Ha az elérési út nem létezik a _.set hívása közben, akkor az létrejön. Nem lesz többé „Nem állítható be a meghatározatlan elemek tulajdonsága” hiba. Ha az elérési út nem létezik, a _.get undefined értéket ad vissza hiba helyett. Ha az elérési út nem definiált, megadhat egy alapértelmezett értéket is (harmadik paraméter).
4. _.találd
Ahelyett, hogy egy tömbön keresztül keresnénk egyetlen objektumot, használhatjuk a _.find parancsot. Ez jó, de nem ez az egyetlen dolog, amit a _.find tehet. Egyetlen kódsorral számos tulajdonság felhasználásával is felfedezhet egy objektumot. Nézd meg!
5. _.keyBy
Az egyik kedvencem a _.keyBy. Nagyon hasznos, ha egy bizonyos attribútummal rendelkező objektumot próbálunk megszerezni. Tételezzük fel, hogy 100 blogbejegyzésünk van, és szeretnénk megragadni a „34abc” azonosítójút. Hogyan fogjuk csinálni? Nézzük mi történik! Ez a módszer segíthet egy objektumgyűjtemény elrendezésében, ha a szerver tömbként biztosítja azt. Egy függvény is használható második argumentumként.
6. _.forEach
Ez a metódus objektumok tömbjén egyenként iterál, lehetővé téve, hogy bármilyen logikát csináljon, amit csak akar. Ebben az első példában a felhasználói objektumok listáját fogom végigvezetni, egyesítve a vezeték- és utónevüket, hogy létrejöjjön egy fullName nevű új tulajdonság.
Ezek mindegyike két paramétert fogad el. Az első paraméter az a tömb, amelyen keresztül hurkolunk. A második argumentum egy iterációs függvény, ahol az első paraméter az egyedi tételhivatkozás, a második pedig az iteráció aktuális indexe.
7. _.térkép
A térkép, akárcsak a forEach, egy sor érték között iterál. A leképezési függvény ezzel szemben az iteráció függvény által biztosított új értéktömböt ad vissza. Ugyanazt a felhasználói gyűjteményt használjuk, mint a forEach példánkban. Használhatjuk a _.map függvényt egy új változó létrehozására, amely az összes felhasználó teljes nevét tartalmazó tömböt tartalmaz.
8. _.különbség
A különbség függvény egy új értéktömböt hoz létre, amelyek különböznek az első és a második tömb között. Létfontosságú megjegyezni, hogy az érvek helye befolyásolja az eredményeket.
9. _.kap
A _.get() függvény segíthet egy elem megtalálásában az objektumon belül. Beállíthatunk egy alapértelmezett értéket a _.get() függvénynek, hogy visszatérjen, ha egy elem nem található a megadott útvonalon. A _.get() függvény három paramétert vesz fel, amelyek közül az első az az objektum, amelyből egy elemet szeretnénk megszerezni. Az út a második. A harmadik érték az az alapértelmezett érték, amelyet vissza akarunk adni, ha egy elem nem található.
10. _.találd
A _find() függvény azonosnak tűnhet a _.get() metódussal. A _.find() függvény a _.get() metódushoz hasonlóan három paramétert fogad el. A _.get() metódussal ellentétben azonban az első argumentum lehet tömb vagy objektum. A második argumentum az egyes iterációk során meghívott függvényt határozza meg. A harmadik bemenet a gyűjtemény kezdő indexe. Mivel a _.find() függvény a gyűjtemény minden eleme felett iterál.
11. _.groupBy
Hozzon létre egy függvény eredménye (vagy egy véletlenszerűen kiválasztott tulajdonságnév) által elnevezett objektumot, ahol minden érték azonos kulcsú objektumok tömbje.
12. _.készlet
A _.set() metódus a _.get() metódus inverze. Megváltoztatja egy elem értékét egy adott útvonalon. Az objektum vagy tömb az első paraméter, az elérési út a második, és a beállítani kívánt érték a harmadik.
13. _.egyesül
Hasonlóan működik, mint az Object.assign, azzal a különbséggel, hogy mélyen behatol a mögöttes struktúrába, hogy frissítse a mélyebb objektumokat, ahelyett, hogy lecserélné őket.
14. ._sorjás
Ez egy meglehetősen egyértelmű példa. Minden „kombináló diakritikus jelölést” eltávolítanak. Így az „é” „e”-vé válik. Nemzetköziesítés és lokalizáció esetén jó gyakorlat a szöveg sorjázása a keresési funkciókhoz.
15. _.bounce
Ez az egyik leghatékonyabb Lodash stratégia. Azt is nehéz lehet felfogni, hogy mit csinál, és mikor érdemes használni. A _.debounce() metódus egy függvényt ad vissza. A _.debounce() metódus függvénye késlelteti a meghívást, amíg a függvény legutóbbi meghívása óta meghatározott számú ezredmásodperc el nem telik.
Következtetés
A Lodash a JavaScript nyelv erőteljes kiterjesztése. Minimális erőfeszítéssel tömör és hatékony kódot készíthetünk. A Lodash is teljesen moduláris. Bár egyes funkciói végül elavultak, úgy gondolom, hogy továbbra is számos előnnyel fog szolgálni a fejlesztők számára, miközben a JS nyelv fejlődését is előmozdítja.
Remélem, ez a néhány Lodash-funkció segít meglátni, milyen erős lehet a Lodash, amikor tömbökkel, objektumokkal és gyűjteményekkel dolgozik. Meglátogathatja a dokumentáció hogy felfedezze az általa kínált lehetőségek tömkelegét.
Hagy egy Válaszol