Currying é um conceito do cálculo lambda, mas não se deixe assustar-é muito simples de implementar.
Currying é uma função que usa um argumento por vez e retorna uma nova função esperando o próximo argumento. É uma transformação de funções que traduz uma função de chamável como f (a, b, c) em chamável como f (a) (b) (c).
Neste artigo, vamos para explorar o que é currying em Javascript, por que e onde você deve usar currying e como implementá-lo com exemplos de código.
O que é currying em JavaScript?
Currying significa simplesmente avaliar funções com vários argumentos e decompondo-os em uma sequência de funções com um único argumento.
Em outros termos, currying é quando uma função-em vez de pegar todos os argumentos de uma vez-pega o primeiro e retorna um novo função, que pega o segundo e retorna uma nova função, que pega o terceiro, etc. até que todos os argumentos sejam completados.
Por que devo usar currying?
Existem vários razões pelas quais currying é ideal:
currying é um método de verificação para garantir que você obtenha tudo o que precisa antes de prosseguir. Ajuda a evitar passar a mesma variável repetidamente. d divide sua função em várias funções menores que podem lidar com uma responsabilidade. Isso torna sua função pura e menos sujeita a erros e efeitos colaterais. É usado na programação funcional para criar uma função de ordem superior. Pode ser uma preferência pessoal, mas adoro que torne meu código legível
Como funciona o currying?
Currying é uma função que aceita vários argumentos. Ele transformará esta função em uma série de funções, onde cada pequena função aceitará um argumento:
Versão não acelerada//const add=(a, b, c)=> {return a + b + c} console.log (add (2, 3, 5))//10 versão Curried//const addCurry=(a)=> {return (b)=> {return (c)=> {return a + b + c}}} console.log (addCurry (2) (3) (5))//10
Currying em Javascript pode ser um pouco complicado de entender em termos de sua definição, mas ficará claro à medida que o implementarmos.
Então, vamos mergulhar em mais exemplos de código.
Exemplo um: Uma função simples de três parâmetros
Primeiro, vou criar uma função simples que aceita três parâmetros:
const add=(a, b, c)=> {return a + b + c} console.log (add (2, 3, 5))//10
Após a saída desta função , o resultado é 10.
O que aconteceu aqui é que esta função está adicionando todos os parâmetros dos números que passamos.
Agora, este primeiro exemplo é apenas uma função simples que aceita vários parâmetros rs.
Como faço para converter uma função existente em uma versão com curry?
Exemplo dois: convertendo uma função existente em uma função com curry
Vamos tentar este segundo exemplo e ver como podemos implementar a função curry.
Neste exemplo, esta função vai aceitar um argumento e retornar uma série de funções:
const addCurry=(a)=> { return (b)=> {return (c)=> {return a + b + c}}}
Esta é a implementação curry da função. Se enviarmos isso, o resultado será 10:
console.log (addCurry (2) (3) (5))//10
No primeiro exemplo, criamos uma função addCurry que aceitava três argumentos a, b e c, adicionaram sua soma a + b + c, (2) + (3) + (5), e retornaram a saída como 10.
Este segundo exemplo mostrou como implementamos o mesma função, mas com uma versão curried que leva um argumento a e retorna uma função que leva outro argumento b, que retorna uma função que leva outro argumento c, e essa função retorna sua soma, o que nos deu a mesma saída do exemplo um: 10.
O que fizemos aqui é uma função aninhada, então cada uma dessas funções recebe um argumento que retorna outro argumento e a função não é concluída até que receba todos os parâmetros.
Exemplo três: Criando uma função curry de solicitação de amizade
Neste exemplo, vamos criar uma função curry simples em que um usuário envia uma solicitação de amizade para seu amigo John:
const sendRequest (greet) {função de retorno ção (nome) {return function (message) {return `$ {greet} $ {name}, $ {message}`}}} sendRequest (‘Hello’) (‘John’) (‘Por favor, você pode me adicionar ao seu Rede Linkedin?’)
Resultado:
“Olá João, por favor, pode me adicionar à sua rede Linkedin?”
Criamos uma função sendRequest que requer apenas um argumento, greet, e retorna o nome da pessoa e a mensagem que queremos enviar ao usuário. Então, quando invocamos a função, ela produz a mensagem.
Técnicas básicas de currying avançadas
currying básico
const getPanCakeIngredients=(ingrediente1)=> {return ( ingrediente2)=> {retornar (ingrediente3)=> {retornar $ {ingrediente1}, $ {ingrediente2}, $ {ingrediente3}; }}} getPanCakeIngredients (‘Ovo’) (‘farinha’) (‘leite’);
Este exemplo de código é uma maneira básica de implementar currying.
No exemplo acima, criamos uma função getPanCakeIngredients que recebe o ingrediente 1 como um único argumento e retorna uma série de funções que contêm os outros ingredientes precisamos fazer a panqueca.
A função não está completa até receber todos os parâmetros, o que significa que se os ingredientes para a panqueca não estiverem completos, a função não retornará nenhum resultado bom.
Currying avançado
Aqui está um exemplo de código de currying avançado:
const curry=(fn)=> {return curry=(… args)=> {if ( fn.length!==args.length) {return curried.bind (null,… args)} return fn (… args); }; } const totalNum=(x, y, z)=> {return x + y + z} const curriedTotal=curry (totalNum); console.log (curriedTotal (10) (20) (30));
No exemplo acima, criamos uma função que requer um número fixo de parâmetros.
Ela recebe uma função curry como função externa. Esta função é uma função de invólucro. Ele retorna outra função chamada curried, que recebe um argumento com o operador de propagação (… args), e compara o comprimento da função fn length.
O comprimento da função significa que qualquer que seja o número de parâmetros que passamos aqui, ele refletirá na propriedade de comprimento da função.
Mas o argumento aumentará a cada vez. Se o número dos parâmetros de que precisamos não for igual, ele retornará curried. Se chamarmos bind, isso cria uma nova função e passamos o (… args).
NB, bind cria uma nova função.
Currying moderno com ES6
Como minha dica bônus, aqui está uma maneira moderna de implementar currying usando o ES6 função de seta. Ajuda a escrever menos código:
const sendRequest=greet=> name=> message=> `$ {greet} $ {name}, $ {message}` sendRequest (‘Hello’) (‘John’) (‘Por favor, você pode me adicionar à sua rede Linkedin?’)
Resultado:
“Olá John, Por favor, você pode me adicionar à sua rede Linkedin?”
Currying pode ser usado para manipular o DOM em Javascript
Pronto para colocar currying em ação? Aqui está um exemplo CodePen simples de como manipular o DOM usando currying :
Exemplo de Curry Dom
Adicionar folhas de estilo/canetas externas Qualquer URL adicionado aqui será adicionado como s em ordem, e antes do CSS no editor. Se você criar um link para outra Caneta, incluirá o CSS daquela Caneta. Se o pré-processador corresponder, ele tentará combiná-los antes do processamento. O pré-processador JavaScript Babel inclui processamento JSX.
Currying vs. aplicação parcial
Agora que você sabe como funciona o currying, qual é a diferença entre currying e uma aplicação parcial? Esta é uma pergunta que os programadores sempre fazem.
Finalmente tenho a resposta para essa pergunta. Mas antes de mergulhar mais fundo nesta explicação com alguns exemplos de código, seria melhor se nos familiarizarmos com suas definições.
Currying: uma função que aceita vários argumentos. Ele irá transformar esta função em uma série de funções, onde cada pequena função aceitará um único argumento até que todos os argumentos sejam concluídos. Aplicação parcial: uma função é parcialmente aplicada quando recebe menos argumentos do que o esperado e retorna uma nova função esperando os restantes argumentos
Saber as definições não é suficiente para entendermos suas diferenças. Você viu currying em ação, mas este é um exemplo de aplicação parcial:
const addPartial=(x, y, z)=> {return x + y + z} var partialFunc=addPartial.bind (this, 2,3); parcialFunc (5);//retorna 10
O que fizemos aqui não é uma versão curried, mas fizemos uma aplicação parcial da função addPartial. Criamos uma função simples que adiciona uma lista de números e retorna sua saída.
NB, uma função é chamada de aplicativo parcial quando algum dos argumentos que ela passa está incompleto.
Currying e a aplicação parcial não são realmente diferentes; eles estão relacionados, mas têm diferentes teorias e aplicações.
O aplicativo parcial converte uma função em outra função, mas com menor aridade.
Conclusão
Para desenvolvedores, currying pode parecer complicado. Embora seja difícil de entender, você aprenderá melhor quando implementá-lo em seus projetos JavaScript.
Implementei currying em alguns de meus projetos e aprendi na prática. Eu usei currying para algumas coisas:
Currying pode ser usado para manipular o DOM em Javascript Ele pode ser usado para acionar ouvintes de eventos Currying pode ser usado quando você deseja criar uma função que receberá apenas argumentos únicos
Obrigado por ler este artigo e sinta-se à vontade para deixar seus comentários. Estou aberto para aprender com você. Saúde!