Nopea johdanto putkeen () ja säveltää () JavaScript-ohjelmassa

Funktionaalinen ohjelmointi on ollut minulle aivan silmiä avaava matka. Tämä viesti ja sen kaltaiset viestit ovat yritystä jakaa käsitykseni ja näkökulmani vaeltaessani uusia toiminnallisia ohjelmointimaita.

Ramda on ollut FP-kirjastoni, koska se helpottaa JavaScriptin toiminnallista ohjelmointia. Suosittelen sitä.

Lahjojen muodostaminen rakenteen muodostamiseksi. Melko syvää kamaa ...

Putki

Putken käsite on yksinkertainen - se yhdistää n toimintoa. Se on putki, joka virtaa vasemmalta oikealle ja kutsuu kutakin toimintoa viimeisen lähdöllä.

Kirjoitetaan funktio, joka palauttaa jonkun nimen.

getName = (henkilö) => henkilö.nimi
getName ({nimi: 'Buckethead'})
// 'Buckethead'

Kirjoitetaan funktio, joka kirjoittaa isoilla kirjaimilla jouset.

iso kirjain = (merkkijono) => merkkijono.toUpperCase ()
isoja ( 'Buckethead')
// 'BUCKETHEAD'

Joten jos halusimme saada ja hyödyntää henkilön nimeä, voimme tehdä tämän:

name = getName ({nimi: 'Buckethead'})
isoja (nimi)
// 'BUCKETHEAD'

Se on hieno, mutta poistetaan välimuuttujan nimi.

iso kirjain (getName ({nimi: 'Buckethead'}))

Parempi, mutta minusta ei ole ihastunut tuosta pesästä. Se voi olla liian tungosta. Entä jos haluamme lisätä funktion, joka saa merkkijonon 6 ensimmäistä merkkiä?

get6Characters = (string) => string.substring (0, 6)
get6Characters ( 'Buckethead')
// 'Kauha'

Johtaen:

get6Characters (iso kirjain (getName ({nimi: 'Buckethead'}))))
'ÄMPÄRI'

Mennään todella hulluksi ja lisätään toiminto kiertojen kääntämiseen.

käänteinen = (merkkijono) => merkkijono
  .jakaa('')
  .käänteinen()
  .liittyä seuraan('')
reverse (Buckethead ')
// 'daehtekcuB'

Nyt meillä on:

käänteinen (get6Characters (iso kirjain (getName ({nimi: 'Buckethead'}))))))
// 'TEKCUB'

Se voi saada vähän ... paljon.

Putki pelastamaan!

Sen sijaan, että häiritsisit funktioita funktioiden sisällä tai loisit joukon välimuuttujia, putkettaan kaikki asiat!

putki(
  getName,
  isoja,
  get6Characters,
  käänteinen
) ({nimi: 'Buckethead'})
// 'TEKCUB'

Puhdas taide. Se on kuin tehtäväluettelo!

Astukaamme läpi.

Demotarkoituksiin käytän putken toteutusta yhdestä Eric Elliottin toiminnallisesta ohjelmointiartikkelista.

putki = (... fns) => x => fns.reduce ((v, f) => f (v), x)

Rakastan tätä pientä vuorausta.

Katso lepoparametrejä käyttämällä artikkelii siitä, että voimme piilottaa n toimintoja. Jokainen toiminto ottaa edellisen tulosteen ja kaikki on pienennetty yhdeksi arvoksi.

Ja voit käyttää sitä aivan kuten edellä.

putki(
  getName,
  isoja,
  get6Characters,
  käänteinen
) ({nimi: 'Buckethead'})
// 'TEKCUB'

Laajennan putkea ja lisän joitain virheenkorjauslausekkeita, ja siirrymme riviltä riville.

putki = (... toiminnot) => (arvo) => {
  debuggeri;
  paluutoiminnot
    .reduce ((currentValue, currentFunction) => {
       debuggeri;
       paluuvirtatoiminto (currentValue);
    }, arvo)
}

Soita putkelle esimerkillämme ja anna ihmeiden näkyä.

Tutustu paikallisiin muuttujiin. funktiot on joukko 4 funktiota, ja arvo on {nimi: 'Buckethead'}.

Koska käytimme lepoparametreja (katso jälleen artikkeli ), putki sallii minkä tahansa määrän toimintojen käyttämisen. Se vain soittaa ja soittaa jokaiselle.

Olemme seuraavassa virheenkorjaimessa sisällä. Tässä vaiheessa currentValue välitetään nykyiselle toiminnolle ja palautetaan.

Näemme tuloksen 'Buckethead', koska currentFunction palauttaa minkä tahansa objektin .name-ominaisuuden. Se palautetaan pienennettynä, mikä tarkoittaa, että siitä tulee seuraavaksi uusi currentValue. Painamme seuraavaa virheenkorjainta ja katso.

Nyt currentValue on 'Buckethead', koska se palautettiin viime kerralla. currentFunction on iso kirjain, joten 'BUCKETHEAD' on seuraava currentValue.

Sama idea, niputa 'BUCKETHEAD''n 6 ensimmäistä merkkiä ja luovuta ne seuraavaan funktioon.

käänteinen ('. aedi emaS')

Ja olet valmis!

Entä säveltäminen ()?

Se on vain putki toiseen suuntaan.

Joten jos halusit samaa tulosta kuin yllä oleva putkimme, tekisit päinvastoin.

säveltää(
  käänteinen,
  get6Characters,
  isoja,
  getName,
) ({nimi: 'Buckethead'})

Huomaa, kuinka getName on viimeinen ketjussa ja käänteinen on ensin?

Tässä artikkelissa on nopea toteutus säveltämiseen, jälleen maagisen Eric Elliottin luvalla.

säveltää = (... fns) => x => fns.reduceRight ((v, f) => f (v), x);

Jätän tämän toiminnon laajentamisen virheenkorjaimien avulla sinulle tehtäväksi. Leikkiä sen kanssa, käyttää sitä, arvostaa sitä. Ja mikä tärkeintä, pidä hauskaa!

Ensi kertaan!

Pitää huolta,
Yazeed Bzadough