Синтаксис ES6 / 8 - функции стрелок

Question

Два следующих результата приводят к разным вещам, хотя они выглядят одинаково.

1

const addBlogPost = dispatch => {
    return () => {
        dispatch({type: 'add_blogpost'});
    }
};

2

const addBlogPost = dispatch => dispatch({type: 'add_blogpost'});

Кто-нибудь может указать чем они отличаются?

Answer 1

Вы можете использовать этот сайт для компиляции функций стрелок es6 в vanilla JS, чтобы легко увидеть разницу.

первый компилируется в этот

var addBlogPost = function addBlogPost(dispatch) {
  return function () {
    dispatch({
      type: 'add_blogpost'
    });
  };
};

В то время как секунда компилируется в этот

var addBlogPost = function addBlogPost(dispatch) {
  return dispatch({
    type: 'add_blogpost'
  });
};

Первая возвращает функцию, у которой есть диспетчеризация, а вторая возвращает диспетчеризацию напрямую.

Answer 2

Результат всегда будет одинаковым, поскольку обе функции перенастраивают одно и то же. Единственное отличие:

1. В первой функции вы возвращаете функцию, которая возвращает объект, возвращающий функцию dispatch.
2. Во второй функции вы возвращая вашу dispatch функцию напрямую.