Curry funktsioonide kasutamine JavaScriptis

Curried-funktsioonid võivad muuta teie JavaScripti koodi loetavamaks ja väljendusrikkamaks. Karrimistehnika on ideaalne, kui soovite jagada keeruka loogika väiksemateks, iseseisvateks ja paremini juhitavateks kooditükkideks.

Siit saate teada kõike JavaScripti curry-funktsioonide kohta, kuidas funktsiooni curryingi loomise tehnikat kasutada osaliselt rakendatud funktsioonid, aga ka reaalsed kasutusjuhud nii kohustuslike kui ka osaliselt rakendatud funktsioonide jaoks funktsioonid.

Mis on karrimine?

Currying on oma nime saanud matemaatik Haskell B järgi. Curry ja kontseptsioon tuleneb lambdaarvutusest. Currying võtab funktsiooni, mis võtab vastu rohkem kui ühe parameetri, ja jagab selle unaarseteks (üheparameetrilisteks) funktsioonideks. Teisisõnu võtab karrifunktsioon korraga ainult ühe parameetri.

Karritamise põhinäide

Allpool on näide curry-funktsioonist:

functionbuildSandwich(ingredient1) 





instagram viewer
{
return(ingredient2) => {
return(ingredient3) => {
return`${ingredient1},${ingredient2},${ingredient3}`
 }
 }
}

The buildSandwich() funktsioon tagastab teise funktsiooni — anonüümse funktsiooni, mis võtab vastu koostisosa 2 argument. Seejärel tagastab see anonüümne funktsioon teise anonüümse funktsiooni, mis võtab vastu koostisosa 3. Lõpuks tagastab see viimane funktsioon malli literaali, mis on viis stringide vormindamine JavaScriptis.

Teie loodud on pesastatud funktsioon, kus iga funktsioon kutsub selle all olevat funktsiooni, kuni jõuame lõpuni. Nüüd, kui helistate buildSandwich() ja edastage sellele üks parameeter, tagastab see funktsiooni osa, mille argumente te veel esitate:

console.log(buildSandwich("Bacon"))

Väljundist näete, et buildSandwich tagastab funktsiooni:

Funktsiooni kutsumise lõpetamiseks peate esitama kõik kolm argumenti:

buildSandwich("Bacon")("Lettuce")("Tomato")

See kood edastab "Pekoni" esimesele funktsioonile, "Salat" teisele ja "Tomat" viimasele funktsioonile. Teisisõnu, buildSandwich() funktsioon on jagatud kolmeks funktsiooniks, kusjuures iga funktsioon saab ainult ühe parameetri.

Kuigi traditsiooniliste funktsioonide abil karri kasutamine on täiesti asjakohane, võib kogu pesastumine muutuda üsna inetuks, mida sügavamale jõuate. Sellest mööda saamiseks võite kasutada noolefunktsioone ja kasutada ära nende puhtamat süntaksit.

const buildMeal = ingred1 =>ingred2 =>ingred3 =>
`${ingred1}, ${ingred2}. ${ingred3}`;

See ümbertöötatud versioon on sisutihedam, kasutamise eelis noolefunktsioonid vs tavafunktsioonid. Funktsiooni saate kutsuda samamoodi nagu eelmisega:

buildMeal("Bacon")("Lettuce")("Tomato")

Osaliselt rakendatud karri funktsioonid

Osaliselt rakendatud funktsioonid on karrimise tavaline kasutus. See meetod hõlmab korraga ainult vajalike argumentide esitamist (kõigi argumentide esitamise asemel). Iga kord, kui käivitate funktsiooni, edastades kõik nõutavad parameetrid, ütlete, et olete selle funktsiooni "rakendatud".

Vaatame näidet:

const multiply = (x, y) => x * y;

Allpool on multipli karri versioon:

const curriedMultiply = x =>y => x * y;

The curriedMultiply() funktsioon võtab vastu x argument esimese funktsiooni ja y teise funktsiooni korral korrutab see mõlemad väärtused.

Esimese osaliselt rakendatud funktsiooni loomiseks helistage curriedMultiple() esimese parameetriga ja määrake tagastatud funktsioon muutujale:

const timesTen = curriedMultiply(10)

Siinkohal on kood "osaliselt rakendatud". curriedMultiply() funktsiooni. Nii et igal ajal, kui soovite helistada kordaKümme(), peate sellele lihtsalt edastama ühe numbri ja see arv korrutatakse automaatselt 10-ga (mis salvestatakse rakendatud funktsiooni sees):

console.log(timesTen(8)) // 80

See võimaldab teil tugineda ühele keerukale funktsioonile, luues sellest mitu kohandatud funktsiooni, millest igaühel on lukustatud oma funktsioonid.

Vaadake näidet, mis on tõelisele veebiarenduse kasutusjuhtumile lähemal. Allpool on teil a updateElemText() funktsioon, mis võtab elemendi id esimese kõne puhul teise kõne sisu ja seejärel värskendab elementi selle põhjal id ja sisu, mille esitasite:

const updateElemText = id = content
 => document.querySelector(`#${id}`).textContent = content
// Lock the element's id into the function:
const updateHeaderText = updateElemText('header')
// Update the header text
updateHeaderText("Hello World!")

Funktsioonide koosseis Curried funktsioonidega

Teine levinud karri kasutamine on funktsioonide koostis. See võimaldab helistada väikeseid funktsioone kindlas järjekorras ja ühendada need üheks keerukamaks funktsiooniks.

Näiteks hüpoteetilisel e-kaubanduse veebisaidil on siin kolm funktsiooni, mida võiksite üksteise järel käitada (täpses järjekorras):

const addCustomer = fn =>(...args) => {
console.log("Saving customer info")
return fn(...args)
}
const processOrder = fn =>(...args) => {
console.log(`processing order #${args[0]}`)
return fn(...args);
}
let completeOrder = (...args) => {
console.log(`Order #${[...args].toString()} completed.`);
}

Pange tähele, et see kood kasutab lase märksõna määratlemiseks täielik tellimus() funktsiooni. See võimaldab muutujale väärtuse ümber määrata ja on osa sellest kuidas ulatuse määramine JavaScriptis töötab.

Järgmiseks peate funktsioonidele helistama vastupidises järjekorras (seest väljapoole), kuna soovite esmalt lisada kliendid:

completeOrder = (processOrder(completeOrder));
completeOrder = (addCustomer(completeOrder));
completeOrder("1000")

See annab teile järgmise väljundi:

Kui kirjutaksite ülaltoodud funktsioonid tavalisel viisil, näeb kood välja umbes selline:

functionaddCustomer(...args) {
returnfunctionprocessOrder(...args) {
returnfunctioncompleteOrder(...args) {
// end
 }
 }
}

Kui helistate addCustomer() funktsioon ja argumendid edasi anda, alustate seestpoolt ja liigute funktsiooni tippu.

Teisendage tavaline funktsioon Curry funktsiooniga Curry funktsiooniks

Kui kavatsete kasutada palju karrifunktsioone, saate protsessi lihtsustada abifunktsiooni abil.

See funktsioon teisendab kõik tavalised funktsioonid karrifunktsiooniks. See kasutab suvalise arvu argumentide käsitlemiseks rekursiooni.

const curry = (fn) => {
return curried = (...args) => {
if (fn.length !== args.length) {
return curried.bind(null, ...args)
 }
return fn(...args);
 }
}

See funktsioon aktsepteerib mis tahes standardset kirjalikku funktsiooni, mis võtab vastu rohkem kui ühe parameetri, tagastades selle funktsiooni karistatud versiooni. Selle toimimiseks kasutage seda näidisfunktsiooni, mis võtab kolm parameetrit ja liidab need kokku:

const total = (x, y, z) => x + y + z

Selle funktsiooni teisendamiseks helistage karri() funktsioon ja pass kokku argumendina:

const curriedTotal = curry(total)

Nüüd, et funktsiooni kutsuda, peate lihtsalt sisestama kõik argumendid:

console.log(curriedTotal(10)(20)(30)) // 60

Lisateave JavaScripti funktsioonide kohta

JavaScripti funktsioonid on äärmiselt paindlikud ja curry funktsioonid on vaid väike osa sellest. On palju muud tüüpi funktsioone, nagu noolefunktsioonid, konstruktorifunktsioonid ja anonüümsed funktsioonid. Nende funktsioonide ja nende komponentidega tutvumine on JavaScripti valdamise võtmeks.