Chained Arrow function syntax

Question

const fetch = url => dispatch => {
  // ...
}

export const fetchQuestions = tag => (dispatch) => {
  return dispatch(fetch(tag));
};

What

Answer 1

dispatch is the first and single parameter of the function returned by the url => ... function. With normal function syntax, it would be

const fetch = function(url) {
    return function(dispatch) {...}
}

Answer 2

Its a shorter way of writing a function that returns another function. The arguments url and dispatch are arguments to the curryed function The ES5 equivalent of arrow function syntax would be

function fetch(url) {
    return function(dispatch) {
         ....
    }
}

or with Arrow syntax as

const fetch = (url) => {
    return (dispatch) => {
        // ... 
    }
}

Similarly you would have fetchQuestion written as

export function fetchQuestions(tag) {
     return function(dispatch){
            return dispatch(fetch(tag));
     }
}

or with Arrow syntax as

export const fetchQuestions = (tag) => {
    return (dispatch) =>  {
        return dispatch(fetch(tag));
    }
};

Answer 3

fetch is a named function expression that takes a url parameter and returns a new function that takes a dispatch parameter.

You could rewrite using traditional function syntax:

const fetch = function (url) {
  return function(dispatch) {
    // ...
  }
}

Answer 4

This is equivalent to one function returning another. I.e. this

const fetch = url => dispatch => {
    // ...
}

is equivalent to

const fetch = function(url) {
    return function(dispatch) {
        // ... 
    }
}

---

Similarly this

export const fetchQuestions = tag => (dispatch) => {
  return dispatch(fetch(tag));
};

is equivalent to

export const fetchQuestions = function(tag) {
    return function(dispatch) {
        return dispatch(fetch(tag));
    }
};