Funkcinis programavimas JavaScript 2 dalis - Kombinatoriai

Įvadas į kombinatorius

Kombinatoriai yra aukštesnio lygio funkcija, leidžianti sujungti funkcijas, kintamuosius ar kitus kombinatorius. Paprastai juose nėra savo kintamųjų ar verslo logikos deklaracijų. Jie yra vieninteliai, skirti funkcinės programos valdymui išplauti.

Šiame straipsnyje pabandysiu aptarti keletą iš jų:

• Bakstelėkite
• Currying
• Vamzdis / Kompozicija
• Šakutės
• Pakaitinis
• Sekvencija

Bakstelėkite

Kombinatorius labai naudingas funkcijoms, kurios nieko negrąžina. Jis paima funkciją, į kurią patenka parametras, ir tada jį grąžina.

Deklaracija

const tap = (fn) => (value) => {
fn(value);
return value;
};

Imperatyvus pavyzdys

const [items, setItems] = useState(() => [])

axios
.get('http://localhost')
.then({ duomenys } => {
setItems(duomenys)
console.log(data)
onLoadData(data)
}).then(...) // grąžinama neapibrėžta - pažadėjime esantys duomenys buvo pakeisti

Deklaratyvinis pavyzdys

const [items, setItems] = useState(() => [])

axios
.get('http://localhost')
.then(({ duomenys }) => duomenys)
.then(tap(setItems)) // (duomenys) => { setItems(duomenys); return data }
.then(tap(console.log)) // vienas then = viena funkcija = viena atsakomybė
.then(tap(onLoadData))
.then(...) // vis dar prieiga prie pradinių duomenų
// lengva išlaikyti atidarymo/uždarymo principą

Currying

Jis padalina funkcijos argumentus ir leidžia juos iškviesti iš eilės.

Deklaracija

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

return curried

};

Pavyzdys

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

return curried

};

const sum = (a, b, c) => a + b + c

const currySum = curry(sum)
/*
galimi iškvietimai
currySum(a)(b)(c),
currySum(a)(b,c),
currySum(a,b)(c),
currySum(a,b,c)
*/

currySum(1) // (b, c) => 1 + a + b arba (b) => (c) => 1 + a + b
currySum(5)(10) // (c) => 5 + 10 + b
currySum(5, 10) // (c) => 5 + 10 + b
currySum(5)(10)(20) // 35
currySum(5, 10)(20) // 35
currySum(5)(10, 20) // 35

const divideBy = curry((a, b) => b / a)
const multiplyBy = curry((a, b) => a * b)

const divideByTwo = divideBy(2)
divideByTwo(10) // grąžina 5

const multiplyByFive = multiplyBy(5)
multiplyByFive(10) // grąžina 50

Vamzdis / Kompozicija

Naudojant kompoziciją galima perduoti duomenis iš vienos funkcijos į kitą. Svarbu, kad funkcijos priimtų tą patį argumentų skaičių. Skirtumas tarp pipe ir compose yra tas, kad pirmoji funkcija vykdo funkcijas nuo pirmos iki paskutinės, o compose jas iškviečia nuo galo.

Deklaracija

const pipe = (...fns) => (value, ...args) =>
fns.reduce((v, f, i) =>
i === 0
? f(v, ...args)
: f(v),
value);

const compose = (...fns) => (value, ...args) =>
fns.reduceRight((v, f, i) =>
i === (fns.length - 1)
? f(v, ...args)
: f(v),
value);

const pipe = (...fns) => (value, ...args) =>
fns.reduce((v, f, i) =>
i === 0
? f(v, ...args)
: f(v),
value);

const compose = (...fns) => (value, ...args) =>
fns.reduceRight((v, f, i) =>
i === (fns.length - 1)
? f(v, ...args)
: f(v),
value);

Imperatyvus pavyzdys

const sine = (val) => Math.sin(val * Math.PI / 180) // neperskaitoma
 sine(90) // grąžina 1

Deklaratyvinis pavyzdys

const sine = pipe(
multiplyBy(Math.PI) // ↓ val * Math.PI
divideBy(180), // ↓ val * Math.PI / 180
Math.sin, // ↓ Math.sin(val * Math.PI / 180)
)

const sine = compose(
Math.sin, // ↑ Math.sin(val * Math.PI / 180)
divideBy(180), // ↑ val * Math.PI / 180
multiplyBy(Math.PI) // ↑ val * Math.PI
)

sinus(90) // grąžina 1

Šakutės

Šakutės derintuvas naudingas tais atvejais, kai norite apdoroti reikšmę dviem būdais ir sujungti rezultatą.

Deklaracija

const fork = (join, fn1, fn2) => (value) => join(fn1(value), fn2(value));

Pavyzdys

const length = (masyvas) => array.length
const sum = (array) => array.reduce((a, b) => a + b, 0)
const divide = (a, b) => a / b

const arithmeticAverage = fork(divide, sum, length)

arithmeticAverage([5, 3, 2, 8, 4, 2]) // grąžina 4

Pakaitinis

Šis kombinatorius naudoja dvi funkcijas ir grąžina pirmosios rezultatą, jei jis yra true. Priešingu atveju grąžinamas antrosios funkcijos rezultatas.

Deklaracija

const alt = (fn, orFn) => (value) => fn(value) || orFn(value)

Pavyzdys

const users = [{ {
uuid: '123e4567-e89b-12d3-a456-426655440000',
vardas: 'William'
}]

const findUser = ({ uuid: searchesUuid }) =>
users.find(({ uuid }) => uuid === searchesUuid)

const newUser = data => ({ ...data, uuid: uuid() // sukurti naują uuid })

const findOrCreate = alt(findUser, newUser)

findOrCreate({ uuid: '123e4567-e89b-12d3-a456-426655440000' }) // grąžina William objektą
findOrCreate({ name: 'John' }) // grąžina John objektą su nauju uuid

Sekvencija

Ji priima daug nepriklausomų funkcijų ir kiekvienai iš jų perduoda tą patį parametrą. Paprastai šios funkcijos negrąžina jokios vertės.

Deklaracija

const seq = (...fns) => (val) => fns.forEach(fn => fn(val))

Pavyzdys

const appendUser = (id) => ({ vardas }) => {
document.getElementById(id).innerHTML = name
}

const printUserContact = pipe(
findOrCreate, // grąžina naudotoją
seq(
appendUser('#contact'), // user => void
console.log, // user => void
onContactUpdate // user => void
)
)

printUserContact(userData)