Ова функција ЈаваСцрипт језика може помоћи да средите свој код и даће вам нову увид у то како функције функционишу.

Цурриед функције могу помоћи да ваш ЈаваСцрипт код буде читљивији и изражајнији. Техника цурриинга је идеална када желите да разбијете сложену логику на мање, самосталне, лакше управљиве делове кода.

Научите све о функцијама са каријем у ЈаваСцрипт-у, како да користите технику карирања функција за креирање делимично примењене функције, као и случајеви коришћења у стварном животу и за функције са каријем и за делимично примењене функције.

Шта је кари?

Кариинг је добио име по математичару Хаскелу Б. Кари, а концепт потиче из Ламбда рачуна. Цурриинг узима функцију која прима више од једног параметра и разбија је у низ унарних (једнопараметарских) функција. Другим речима, цурриед функција узима само један параметар у исто време.

Основни пример карирања

Испод је пример функције цурриед:

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

Тхе изгради сендвич() функција враћа другу функцију — анонимну функцију која прима састојак2 расправа. Затим, ова анонимна функција враћа другу анонимну функцију која прима састојак3. Коначно, ова последња функција враћа литерал шаблона, начин форматирање стрингова у ЈаваСцрипт-у.

Оно што сте креирали је угнежђена функција где свака функција позива ону испод себе док не дођемо до краја. Сада, када зовеш изгради сендвич() и проследите му један параметар, вратиће део функције чије аргументе тек треба да наведете:

console.log(buildSandwich("Bacon"))

Из излаза можете видети да буилдСандвицх враћа функцију:

Да бисте довршили позив функције, требало би да наведете сва три аргумента:

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

Овај код прослеђује „сланину“ на прву функцију, „Салату“ на другу, а „парадајз“ на последњу функцију. Другим речима, тхе изгради сендвич() функција је заиста подељена на три функције, при чему свака функција прима само један параметар.

Иако је савршено ваљано користити кари користећи традиционалне функције, сво угнежђење може постати прилично ружно што дубље улазите. Да бисте ово заобишли, можете користити функције стрелице и искористити њихову чистију синтаксу:

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

Ова рефакторисана верзија је сажетија, што је предност коришћења функције стрелице у односу на регуларне функције. Функцију можете позвати на исти начин као и претходну:

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

Делимично примењене кари функције

Делимично примењене функције су уобичајена употреба карија. Ова техника подразумева достављање само потребних аргумената у исто време (уместо да се достављају сви аргументи). Кад год позовете функцију преношењем свих потребних параметара, кажете да сте „примјенили“ ту функцију.

Погледајмо пример:

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

Испод је верзија множења са каријем:

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

Тхе цурриедМултипли() функција прима Икс аргумент за прву функцију и и за другу функцију, онда множи обе вредности.

Да бисте креирали прву делимично примењену функцију, позовите цурриедМултипле() са првим параметром и доделите враћену функцију променљивој:

const timesTen = curriedMultiply(10)

У овом тренутку, код је "делимично применио" цурриедМултипли() функција. Дакле, кад год желите да позовете тимесТен(), само треба да му проследите један број и број ће се аутоматски помножити са 10 (који се чува унутар примењене функције):

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

Ово вам омогућава да изградите једну сложену функцију креирањем више прилагођених функција од ње, од којих свака има своју закључану функционалност.

Погледајте пример који је ближи стварном случају коришћења веб развоја. Испод имате а упдатеЕлемТект() функција која узима елемент ид на првом позиву, садржај на другом позиву, а затим ажурира елемент на основу ид и садржај који сте му доставили:

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!")

Композиција функција са карираним функцијама

Још једна уобичајена употреба карија је функционална композиција. Ово вам омогућава да позовете мале функције, одређеним редоследом, и комбинујете их у једну, сложенију функцију.

На пример, на хипотетичкој веб локацији за е-трговину, ево три функције које бисте можда желели да покренете једну за другом (прецизним редоследом):

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.`);
}

Обратите пажњу да овај код користи дозволити кључну реч за дефинисање цомплетеОрдер() функција. Ово вам омогућава да поново доделите вредност променљивој и део је како функционише опсег у ЈаваСцрипт-у.

Затим, морате да позовете функције обрнутим редоследом (изнутра ка споља) јер бисте прво желели да додате клијенте:

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

Ово ће вам дати следећи излаз:

Ако бисте горње функције написали на уобичајен начин, код ће изгледати отприлике овако:

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

Када позовете аддЦустомер() функцију и проследите аргументе, почињете изнутра и напредујете до врха функције.

Конвертујте нормалну функцију у карију функцију помоћу кари функције

Ако планирате да често користите функције са каријем, можете да поједноставите процес помоћу функције помоћника.

Ова функција ће претворити било коју нормалну функцију у функцију цурриед. Користи рекурзију за руковање било којим бројем аргумената.

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

return fn(...args);
}
}

Ова функција ће прихватити било коју стандардну писану функцију која прима више од једног параметра, враћајући исписану верзију те функције. Да бисте то видели у акцији, користите овај пример функције која узима три параметра и збраја их:

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

Да бисте конвертовали ову функцију, позовите кари () функција и пролаз укупно као аргумент:

const curriedTotal = curry(total)

Сада да бисте позвали функцију, само треба да унесете све аргументе:

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

Више о функцијама у ЈаваСцрипт-у

ЈаваСцрипт функције су изузетно флексибилне и функције цурриинга су само мали део тога. Постоје многе друге врсте функција као што су функције стрелице, функције конструктора и анонимне функције. Упознавање са овим функцијама и њиховим компонентама кључно је за савладавање ЈаваСцрипт-а.