ES6-metodit
ES6, joka on lyhenne sanoista ECMAScript 6, on kesäkuussa 2015 julkaistu versio JavaScriptistä. Näyttää siltä, että JavaScriptiä ylläpitävät kehittäjät pitävät syntymäkuukaudestani, koska silloin julkaistiin suurin osa heidän versioistaan.
Jos olet vasta opettelemassa JavaScriptiä, ES6 helpottaa elämääsi huomattavasti. Se ei tarjoa vain array-metodeja, vaan se tarjoaa myös muun muassa destrukturointia, nuolifunktioita, paremman tavan kirjoittaa oliosuuntautunutta ja modulaarista koodia.
Molemmat näistä ES6:n array-metodeista ottavat takaisinkutsufunktion, ja siksi niitä kutsutaan korkeamman järjestyksen array-metodeiksi. Nuolifunktiot ovat hyvin yleisiä korkeamman asteen funktioissa, koska se yksinkertaistaa koodiamme
Map-metodi
Jos on ES6:n array-metodi, jota käytät lähes koko ajan, se on tämä metodi. Se on paras array-metodini sekä JavaScriptissä että Pythonissa. Vaikka jotkut JavaScript-kehittäjät ovat yrittäneet toteuttaa map-metodin ennen ES6:ta, standardi map-metodi otettiin käyttöön JavaScriptissä ES6:ssa. Alla olevassa koodinpätkässä toteutin map:n kolmella tavalla:
- Käyttämällä tavallisia JavaScript-funktioita: Tässä annoin funktiolle kaksi argumenttia, ensin
item, joka on elementti, jolle haluan tehdä jotain, ja valinnainen argumenttiindex, joka on kunkin elementin indeksi - Nuolifunktioiden käyttäminen: Myös minä annoin kaksi argumenttia kuten ensimmäisessä esimerkissä, mutta callback-funktio on tässä nuolifunktio, mikä tekee koodista paljon siistimpää.
- Minäkin käytin nuolifunktioita, mutta annoin vain yhden argumentin – elementin, jonka suhteen haluan iteroida. Tämä on hyödyllistä, jos en tarvitse indeksiä.
Suodatinmetodi
Metodi filter on toinen ylemmän järjestyksen matriisimetodi, jota kannattaa käyttää nykyään. Se, mitä filter tekee, on yksinkertaista. Kun annamme elementtimassan, haluamme palauttaa alkuperäisestä massasta uuden massan, jossa tietty ehto on true. Takaisinkutsufunktion on palautettava boolean, ja se elementti, joka noudattaa ehtoa, on se, mikä tulee uuteen arrayyn.
Redusointimenetelmä
Tämä on erittäin hieno, ja mielestäni vaikein kaikista tähän mennessä mainitsemistani menetelmistä. Mitä tämä metodi tekee, on se, että se käyttää tiettyä takaisinkutsua matriisin pienentämiseen. Esimerkiksi, jos haluan löytää matriisin kaikkien elementtien summan tai matriisin kaikkien elementtien tulon, tätä metodia on mukava käyttää sen sijaan, että silmukoitaisiin ja kasvatettaisiin alkuperäistä summaa tai tuloa.
The forEach-metodi
Tämä metodi on samanlainen kuin map-metodi, mutta tässä tapauksessa se ei palauta uutta arraya. Se on enemmänkin tavallinen for-silmukka JavaScriptissä, mutta puhtaammalla ja kehittyneemmällä tavalla. Se ottaa kolme parametria, kuten ehkä tiesitkin. Ensimmäinen on elementti matriisissa, toinen on elementin indeksi (joka on valinnainen) ja kolmas on matriisin objekti, johon nykyinen elementti kuuluu.
Alhaalla olevassa koodinpätkässä käytin forEach:ää dokumentin objektimallin (Document Object Model, DOM) manipulointiin, mikä on aika siistiä. Voin päivittää arraya, ja DOM:ssa renderöidyt listan elementit muuttuvat automaattisesti.
Metodin concat
On tapauksia, joissa haluat liittää tai sulauttaa kahta tai useampaa arraya yhteen. Silloin tämä funktio on erittäin kätevä. Kutsumalla concat kahdelle matriisille saadaan uusi matriisi, joka koostuu kahdesta yhdistetystä matriisista.
Jokainen- ja some-metodit
Nämä metodit ovat käyttökelpoisia silloin, kun halutaan tietää, läpäisevättekö jotakin ehtoa jotakin matriisin kaikki elementit ja jotkin matriisin elementit jotakin ehtoa.
Muut metodit ovat:
Fill-metodi
Täyttää jokaiseen joukon alkioon parametrina annetun arvon: .fill(1) // .
The entries-metodi
Tämä saa joukon käyttäytymään kuin objekti, jossa on avain-arvopari, jossa avain on indeksi ja arvo on elementti.
The find-metodi
Tämä metodi palauttaa joukon ensimmäisen elementin, joka läpäisee testin. Se ottaa callback-funktion, joka palauttaa boolean-arvon.
The splice-metodi
Tämä metodi ottaa äärettömän määrän parametreja – kaksi ensimmäistä ovat indeksi, josta halutaan aloittaa elementtien lisääminen ja poistaminen, ja vastaavasti poistettavien elementtien määrä – ja loput parametrit ovat elementtejä, jotka halutaan lisätä arrayyn. Se palauttaa poistettujen elementtien joukon ja muuttaa joukon.
Käänteismetodi
Käänteismetodi kääntää joukon päinvastaiseksi. Huomaa, että se mutatoi sitä, eli se muuttaa arraya sen sijaan, että se vain loisi siitä kopion.
The join-metodi
Tämä metodi kääntää arrayn arrayksi merkkijonoksi. Huomaa, että se ei mutatoi arraya – se vain luo siitä kopion. Tämän metodin kääntöpuolena on split-metodi, joka muuttaa merkkijonon arrayksi. Se ottaa parametrina merkkijonon, jota käytetään yhdistämään array:n jokainen elementti.
The flat-metodi
flat-metodi on uusi metodi, joka lisättiin ES11:ssä (ES11 luotiin tämän vuoden kesäkuussa). Tämä metodi litistää joukon.
Esitettäköön, että meillä on joukko, joka sisältää joukon, ja haluamme löytää jokaisen joukon sisällä olevan joukon jokaisen elementin summan ja tulon. Tarkoitan, että jos minulla on array, joka on määritelty , ]:llä, summan pitäisi olla 10 ja tuotteen pitäisi olla 24.
Yksi tapa tehdä tämä on käydä silmukalla läpi alkuperäinen array ja käydä silmukalla läpi jokainen elementti ja saada summa ja tuote.
Es6:lla voin käydä silmukalla läpi alkuperäisen array:n ja käyttää metodia reduce saadakseni summan ja tuotteen jokaisesta elementistä pääasiallisessa array:ssä – ja käyttää sitä saadakseni kokonaissumman ja -funktion. Mutta flat-matriisin avulla voin tasoittaa päämatriisin, jolloin palautan yhden matriisin, joka sisältää vain numeroita, ja voin käyttää siihen reduce-metodia.
The flatMap-metodi
Tämä on flat:n ja map:n yhdistelmä. Se mapittaa jokaisen matriisin elementin annettuun callback-funktioon ja litistää sitten tuloksena olevan matriisin.
Esitettäköön, että haluaisimme saada litistämättömän matriisin jokaisen elementin neliön, ja haluaisimme litistää sen. Tämä menetelmä helpottaa elämäämme. Osassa, jossa käytin flatMap-metodia alla olevassa koodinpätkässä, se ottaa elementin, joka on array, ja palautin uuden array:n, joka on elementtien neliö. Ja lopuksi se litistää tuloksena olevan array:n.
