Redux thunk - Why are Aysnc functions curried?

Hi, I’m learning Redux and confused by the purpose of using curried functions for actions.
For example,


An article from Here.
Question1: I understand it as fetchPosts()(dispatch) { ....... }. Why don’t we just write it as fetchPosts(dispatch) ?
Question2: We pass ‘dispatch’ as a parameter but we don’t seem to use it. The ‘dispatch’ inside the implementation is a 'dispatch()’ method but not from the parameter, right? What’s the point of passing ‘dispatch’ as a parameter then?
I might have some misunderstandings. Big thanks for any answers.

fetchProducts() is not regular function per se, it’s more like action constructor and you actually never really pass it to dispatch rather you pass the result of this function (dispatch expects object, not a function).

redux-thunk is a middleware that “intercepts” all calls to dispatch and it has to distinguish between synchronous and async actions, so when your action constructor returns object it knows it’s sync and if function - it assumes you want async action. That’s the reason #1.

Then redux-thunk has to “promisify” your action and in order to do that it again needs a function, so that’s the reason #2.

To answer your questions

You cannot do that, but you can just pass the return function to dispatch:

store.dispatch((dispatch) => { /* ... */ }); // This would work

Wrong. It goes from the parameter. And this parameter will be passed by redux-thunk, not you.

1 Like

Thank you! That’s really helpful and I feel much clearer on the concepts now.