Kehittäjältä ei vaadita vain tehtävien suorittamista, vaan se on myös välttämätöntä tehdä tehtäviä tehokkaammin. JavaScriptissä on nykyään saatavilla useita kirjastoja, jotka helpottavat muuttujien käyttöä kehittäjille. Tässä opetusohjelmassa opimme käyttämään Lodash-kirjaston yleisimpiä toimintoja.
Jos et ole vielä kokeillut Lodashia, nyt on oikea hetki. Lodash on nykyaikainen JavaScript-apuohjelma, joka yksinkertaistaa taulukoiden, kokonaislukujen, objektien, tekstien ja muiden tietotyyppien käsittelyä.
Se auttaa sinua käsittelemään erilaisia objekteja ja säästää aikaa poistamalla tarpeen koodata yleisiä menetelmiä. Koodisi on selkeämpi ja vähemmän rivejä, ja se toimii kaikissa selaimissa. Jos et vielä käytä sitä, sinun tulee harkita sitä huolellisesti.
Lodashin käyttämättä jättäminen on valtava menetys JavaScript-koodikannoillemme. Se on bugiton ja tyylikäs ratkaisu työssämme esiintyviin yleisiin haasteisiin, ja sen hyödyntäminen tekee koodistamme vain luettavamman ja hallittavamman.
Tutustutaanpa joihinkin suosituimpiin (tai ei!) Lodash-toimintoihin ja selvitetään kuinka erittäin hyödyllinen ja kaunis tämä kirjasto on.
1. _.sortedUniq
Kaikkia päällekkäisiä arvoja ei palauteta tämän kanssa. Koska se on vain lajiteltuja taulukoita varten, sitä käytetään pääasiassa nopeussyistä. Tästä on hyötyä vain, jos kyseessä on suuri joukko. Jos haluat parantaa nopeutta, lajittele taulukkosi ja käytä menetelmiä, jotka toimivat paremmin lajiteltujen taulukoiden kanssa.
Lodashilla on useita muita tämän kaltaisia toimintoja. Voit tarkastella .sortedIndex, .sortedIndexBy, .sortedIndexOf, .sortedLastIndex, .sortedLastIndexBy, .sortedLastIndexOf, .sortedUniq, .sortedUniqBy, .sortedUniqBy, .sortedUniqBy, .sortedUniqBy.
2. _.vähentää
_.reduce on samanlainen kuin suodatintoiminto. Ainoa ero on, että sinulla on mahdollisuus valita palautetun objektin muoto. Se on normaalia, jos et ymmärrä mitä sanon; siitä on esimerkki.
Pohjimmiltaan palautamme uuden objektin, joka sisältää iän mukaan luokiteltuja käyttäjiä, mutta vain 18-59-vuotiaille. Tämä Lodash-aputoiminto on yksi yleisimmin käytetyistä. Se sisältyy myös ES6:een. Haluaisin myös huomauttaa kaksi tyypillistä virhettä: muista palauttaa tulos funktion lopussa ja antaa tuloksen oletusarvo kolmantena parametrina (tässä).
3. _.get ja ._set
Tässä huijaan sinua hieman näyttämällä kaksi toimintoa, jotka suorittavat lähes saman asian. _.get palauttaa ominaisuuden arvon objektista, ja _.set, no, arvasit sen, asettaa ominaisuuden arvolla. Ei mitään ainutlaatuista, paitsi että pääset omaisuuteen sen polun kautta.
Katsotaanpa esimerkkiä.
Jos polkua ei ole _.set kutsumisen aikana, se luodaan. "Ei voi asettaa määrittämättömien ominaisuuksien "kohteita" -virheitä ei enää ole. Jos polkua ei ole olemassa, _.get palauttaa undefined virheen sijaan. Jos polku muuttuu määrittelemättömäksi, voit myös antaa oletusarvon (kolmas parametri).
4. _.etsi
Sen sijaan, että etsimme yhden objektin taulukon läpi, voimme käyttää _.find-funktiota. Se on hyvä, mutta se ei ole ainoa asia, jonka _.find voi tehdä. Yhdellä koodirivillä voit myös löytää kohteen käyttämällä useita ominaisuuksia. Tarkista se!
5. _.keyBy
Yksi suosikeistani on _.keyBy. Se on varsin hyödyllinen yritettäessä saada objektia, jolla on tietty attribuutti. Oletetaan, että meillä on 100 blogimerkintää ja haluamme napata yhden, jonka tunnus on "34abc". Miten aiomme tehdä sen? Katsotaan, mitä tapahtuu! Tämä menetelmä voi auttaa sinua järjestämään objektikokoelman, jos palvelin tarjoaa sen taulukkona. Funktiota voidaan käyttää myös toisena argumenttina.
6. _.jokaiselle
Tämä menetelmä toistaa objektijoukon yksitellen, jolloin voit tehdä mitä tahansa logiikkaa. Tässä ensimmäisessä esimerkissä käyn läpi luettelon käyttäjäobjekteista ja yhdistän heidän etu- ja sukunimensä ja luon uuden ominaisuuden nimeltä fullName.
Kukin näistä hyväksyy kaksi parametria. Matriisi, jonka yli silmukkaamme, on ensimmäinen parametri. Toinen argumentti on iterointifunktio, jossa ensimmäinen parametri on yksittäisen kohteen viite ja toinen on iteroinnin nykyinen indeksi.
7. _.kartta
Kartta, kuten forEach, iteroituu useiden arvojen yli. Karttatoiminto puolestaan palauttaa iterointifunktion tarjoaman uuden joukon arvoja. Käytämme samaa käyttäjäkokoelmaa kuin tässä ForEach-esimerkissä. Voimme käyttää _.map-funktiota uuden muuttujan luomiseen, jossa on litteä taulukko kaikista käyttäjien täydellisistä nimistä.
8. _.ero
Erotusfunktio tuottaa uuden joukon arvoja, jotka eroavat ensimmäisen ja toisen taulukon välillä. On tärkeää huomata, että argumenttien sijainnit vaikuttavat lopputulokseen.
9. _.get
Funktio _.get() voi auttaa meitä paikantamaan elementin objektin sisällä. Voimme asettaa oletusarvon _.get()-funktiolle, joka palautetaan, jos elementtiä ei löydy annetusta polusta. Funktio _.get() ottaa kolme parametria, joista ensimmäinen on objekti, josta halutaan saada elementti. Polku on toinen. Kolmas arvo on oletusarvo, jonka haluamme palauttaa, jos elementtiä ei löydy.
10. _.etsi
Funktio _find() saattaa näyttää olevan identtinen _.get()-menetelmän kanssa. Funktio _.find(), kuten _.get()-metodi, hyväksyy kolme parametria. Kuitenkin toisin kuin _.get()-metodi, ensimmäinen argumentti voi olla jono tai objekti. Toinen argumentti määrittää funktion, jota kutsutaan jokaisessa iteraatiossa. Kolmas syöte on kokoelman aloitusindeksi. Koska _.find()-funktio iteroituu kokoelman jokaisen elementin yli.
11. _.groupBy
Luo objekti, joka on nimetty funktion tuloksen (tai satunnaisesti valitun ominaisuuden nimen) perusteella, ja jokainen arvo on joukko objekteja, joilla on samalla avaimella.
12. _.set
Metodi _.set() on käänteinen menetelmälle _.get(). Se muuttaa elementin arvoa tietyllä polulla. Objekti tai matriisi on ensimmäinen parametri, polku on toinen ja arvo, jonka haluat asettaa, on kolmas.
13. _.yhdistää
Se toimii samalla tavalla kuin Object.assign, paitsi että se palaa syvälle taustalla olevaan rakenteeseen päivittääkseen syvemmät kohteet niiden korvaamisen sijaan.
14. ._purseenpoisto
Tämä on melko suora esimerkki. Kaikki "diakriittisten merkintöjen yhdistäminen" poistetaan. Näin "é" muuttuu "e". Kun on kansainvälistymistä ja lokalisointia, on hyvä käytäntö poistaa tekstiä hakutoimintoja varten.
15. _.debounce
Tämä on yksi tehokkaimmista Lodash-strategioista. Saattaa myös olla vaikea ymmärtää, mitä se tekee ja milloin sitä pitäisi käyttää. Metodi _.debounce() palauttaa funktion. Metodin _.debounce() funktio viivyttää kutsumista, kunnes funktion viimeisestä kutsumisesta on kulunut tietty määrä millisekunteja.
Yhteenveto
Lodash on JavaScript-kielen tehokas laajennus. Pienellä vaivalla voidaan rakentaa ytimekäs ja tehokas koodi. Lodash on myös täysin modulaarinen. Vaikka jotkin sen toiminnoista saatetaan lopulta vanhentua, uskon, että se tarjoaa silti lukuisia etuja kehittäjille samalla kun se edistää JS-kielen kehitystä.
Toivon, että nämä muutamat Lodash-ominaisuudet auttavat sinua näkemään, kuinka tehokas Lodash voi olla työskennellessäsi taulukoiden, objektien ja kokoelmien kanssa. Voit vierailla dokumentointi tutkia lukuisia muita sen tarjoamia vaihtoehtoja.
Jätä vastaus