Kuidas luua poodi puhaste funktsioonide abil?

Avastage funktsionaalne JavaScripti nimetati BookAuthority üheks parimaks uueks funktsionaalse programmeerimise raamatuks!

Foto Ugur Akdemir saidil Unsplash

Puhtad funktsioonid annavad sama sisendi korral sama väljundväärtuse. Neil pole kõrvaltoimeid ja neid on kergem lugeda, mõista ja testida.

Kõike seda arvestades tahaksin luua poe, mis peidab riiki, kuid kasutab samal ajal puhtaid funktsioone.

Muutmatus

Puhtad funktsioonid ei muuda nende sisendit. Nad käsitlevad sisendväärtusi muutumatuna.

Muutumatu väärtus on väärtus, mida pärast loomist ei saa muuta.

Immvable.js pakub muutumatuid andmestruktuure nagu näiteks nimekiri. Muutumatu andmestruktuur loob iga toimingu korral uue andmestruktuuri.

Mõelge järgmisele koodile:

impordi {nimekiri} kataloogist "muutumatu";
const list = Loend ();
const newList = list.push (1);

push () loob uue loendi, millel on uus element. See ei muuda olemasolevat loendit.

Kustuta () tagastab uue loendi, kus määratud indeksi element eemaldati.

Loendi andmestruktuur pakub kena liidest loenditega muutumatul viisil töötamiseks, nii et kasutan seda riigiväärtusena.

Pood

Kauplus haldab osariiki.

Olek on andmed, mida saab muuta. Kauplus peidab selle oleku andmed ja pakub avalikku meetodit sellega töötamiseks.

Tahaksin luua raamatupood meetoditega add (), remove () ja getBy ().

Ma tahan, et kõik need funktsioonid oleksid puhtad funktsioonid.

Poes kasutatakse kahte tüüpi puhast funktsiooni:

  • funktsioonid, mis loevad ja filtreerivad olekut. Ma nimetan neid getteriteks.
  • funktsioone, mis muudavad olekut. Ma nimetan neid setteriteks.

Mõlemad seda tüüpi funktsioonid võtavad esimese parameetrina oleku.

Kirjutagem pood puhaste funktsioonide abil.

impordi {nimekiri} kataloogist "muutumatu";
importida osast "lodash / osaline";
importi vastetProperty kaustast "lodash / matchProperty";
// setterid
funktsiooni lisamine (raamatud, raamat) {
  tagastama raamatud.push (raamat);
}
funktsiooni eemaldamine (raamatud, raamat) {
  const index = raamatud.findIndex (matchProperty ("id", book.id));
  tagastama raamatud.delete (register);
}
// getterid
funktsioon queryContainsBook (päring, raamat) {
  if (päring && query.text) {
    tagastama book.title.includes (query.text);
  }
  tagasi tõsi;
}
funktsioon getBy (raamatud, päring) {
  tagastama raamatud.filter (osaline (queryContainsBook, päring)). toArray ();
}

Raamatukogu

Olek peaks olema peidetud kauplusobjekti sisse. Ma ei taha riiki väljastpoolt kaupluseobjekti saata. Samal ajal tahan saada kõik puhaste funktsioonide eelised ja kasutada neid kaupluse meetodite määratlemiseks.

Kuidas seda saavutada?

Oleme vastust Reduxis näinud. Kirjutame puhtad funktsioonid ja laseme raamatukogul poe luua ning puhaseid funktsioone rakendada.

Kaupluse määratlemiseks tahaksin raamatukogu kasutada järgmiselt:

impordi {nimekiri} kataloogist "muutumatu";
impordi pood kataloogist "./Store-toolbox";
// setterid
funktsiooni lisamine (raamatud, raamat) {}
funktsiooni eemaldamine (raamatud, raamat) {}
// getterid
funktsioon getBy (raamatud, päring) {}
eksporti vaikeseade Store ({
  olek: Loend (),
  setterid: {lisa, eemalda},
  getters: {getBy}
});

Ehitame selle mikroraamatukogu, mis loob poe puhtal getteril ja setteril.

Kõik avalikud korraldajad ja setterid on kaunistatud ja nende esimene parameeter saab oleku.

  • Getterite tagastatav väärtus tagastatakse helistaja funktsioonidele.
  • Stettersilt tagastatud väärtust kasutatakse oleku muutmiseks. Helistaja funktsioonid ei saa uut olekut.
funktsioon decoMethods (obj, dekoraator) {
  lase newObject = {... obj};
  Object.keys (newObject) .forEach (funktsioon decoMethod (fnName) {
    if (typeof newObject [fnName] === "function") {
      newObject [fnName] = dekoraator (newObject [fnName]);
    }
  });
  tagastama newObject;
}
funktsioon Store (storeConfig) {
  tagastamise funktsioon () {
    lase olek = storeConfig.state;
    funktsiooni valija (fn) {
      tagastamise funktsioon (... args) {
        olek = fn (olek, ... args);
      };
    }
    funktsiooni hankija (fn) {
      tagastamise funktsioon (... args) {
        tagasi fn (olek, ... args);
      };
    }
    tagasta objekt Object.freeze ({
      ... decorationMethods (storeConfig.getters, getter),
      ... decorationMethods (storeConfig.setters, setter)
    });
  };
}
eksport vaikimisi Store;

Store () loob funktsiooni, mis tagastab objekti, mis kapseldab oleku.

Loome ja kasutame objekti bookStore:

importige BookStore kataloogist "./BookStore";
const bookStore = BookStore ();
bookStore.add ({id: 1, pealkiri: "Kuidas JavaScript töötab"});

BookStore.add ({}) helistades kutsub setterite kujundaja lisama () puhta setteri funktsiooni praeguse olekuga esimese parameetrina ja uue raamatu teise parameetrina. Seejärel kasutab setteri dekoraator tulemust oleku väärtuse muutmiseks.

Objekt

Analüüsime objekti BookStore.

Selles paljastatakse ainult kolm meetodit, kõik muud puhtad funktsioonid on privaatsed.

Objekti avalikku liidest ei saa väljastpoolt muuta.

Riik on varjatud. Objekti bookStore kasutavad kliendid pääsevad olekule ainult avalike meetodite kaudu.

Järeldus

Puhtaid funktsioone on lihtsam põhjendada.

Saame raamatukogu abil luua oleku peitva ja puhtaid funktsioone kasutava poe.

Saame kirjutada ainult puhtaid funktsioone ja lasta raamatukogul neid rakendada ja mutatsiooni teha.

Näidiskoodi saate vaadata saidil koodandbox.io.

Avastage funktsionaalne JavaScripti nimetati BookAuthority üheks parimaks uueks funktsionaalse programmeerimise raamatuks!

Funktsionaalsete võtete reageerimise kohta lisateabe saamiseks vaadake funktsionaalset reageerimist.

Siit saate teada, kuidas rakendada kujundusmustrite põhimõtteid.

Leiate mind Twitterist.