Estou estudando Redux nos últimos dias e me deparei com uma função tanto quanto intrigante dentro da biblioteca do Redux

export default connect({state: modules})(Component);

E fiquei curioso para entender essa função com dois parênteses ou função com dois parâmetros, ou que seja! Uma função com ()().

Sem entrar em muitos detalhes logo descobri que estas funções chamam High Order Functions e uma galera tenta explicar como aqui e aqui como funções que são feitas para reaproveitar código, funções que tem como objetivo trazer mais abstração blá blá blá e tudo mais.

Porém tudo que eu entendi foi que se tratava de uma função que retorna uma outra função.

Quer ver? Vamos acessar o velho node.js no terminal e vermos o que o javascript nos diz a respeito disso..

Vou criar uma função que retorna outra função e tentar somar os parâmetros, assim:

function add(a) {
    return (b) => a + b;
}

Engraçado essa forma né?

e se for dessa forma?

const minus = (a) => (b) => a - b;

Pelo jeito isso funciona, mas porque?

Isso se trata de um comportamento não muito usado por nós programadores mas que é do Javascript e é padrão em diversas linguagens, pois trata cada retorno da função como um novo parênteses ().

Mas daí você deve estar pensando... Quantos retornos? E eu vou te responder quantos você quiser! Vamos fazer um exemplo que irá ter 3 parênteses:

function sumThree(a) {
    return (b) => (c) => a + b + c;
}

Mas isso só começa ficar interessante quando pensamos a utilidade disso, observe:

function passParam(a) {
    return (b) => b(a);
}

Esta função tem como utilidade receber qualquer função e passar como parâmetro o outro parênteses.

Mas porquê?

Talvez você queira pegar de uma estutura global e colocar em seu componente local... Isso te lembra algo? Tipo o connect do redux?

Troque o squared por um componente e o primeiro parênteses por um estado global da aplicação e voilá você entendeu o connect do redux, ou não. Vai saber...