Понимание функций компоновки в сокращении

Я пытался создать хранилище в redux, для которого в настоящее время я использую следующий синтаксис: -

const middlewares = [
  thunk,
  logger
]

const wlStore = createStore(
  rootReducer,
  initialState
  compose(applyMiddleware(...middlewares))
)

Вышеупомянутое работает отлично для меня, и я могу получить доступ к хранилищу, но в последнее время я столкнулся с другим синтаксисом: -

const wlStore=applyMiddleware(thunk,logger)(createStore)(rootReducer)

Оба они, похоже, выполняют ту же работу.

Есть ли какая-то причина, из-за которой я должен предпочесть один за другим? Плюсы/минусы?

Ответы

Ответ 1

Улучшенная читаемость и удобство - вот основные преимущества использования compose.

Compose используется, когда вы хотите передать несколько хранилищ в хранилище. Усовершенствования хранилища - это функции более высокого порядка, которые добавляют некоторые дополнительные функции в магазин. Единственным энтузиастом магазина, который по умолчанию поставляется с Redux, является применениеMiddleware, однако доступно много других.

Устройщики магазина - это функции более высокого порядка

Что такое функции более высокого порядка? Парафраз из Документы Haskell:

Функции более высокого порядка могут принимать функции в качестве параметров и возвращать функции в качестве возврата значения. Функция, которая делает любой из них, называется более высоким порядком Функция

Из документов Redux:

Все compose does позволяет вам писать глубоко вложенные преобразования функций без правого дрейфа кода. Не давайте ему слишком много кредитов!

Итак, когда мы связываем наши функции более высокого порядка (энхансеры хранилища) вместо того, чтобы писать

func1(func2(func3(func4))))

мы могли бы просто написать

compose(func1, func2, func3, func4)

Эти две строки кода делают то же самое. Это отличается только синтаксисом.

Пример Redux

Из Redux docs, если мы не будем использовать compose, у нас будет

finalCreateStore = applyMiddleware(middleware)(
      require('redux-devtools').devTools()(
       require('redux-devtools').persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/))()
     )
     )(createStore);

Если мы используем compose

finalCreateStore = compose(
    applyMiddleware(...middleware),
    require('redux-devtools').devTools(),
    require('redux-devtools').persistState(
      window.location.href.match(/[?&]debug_session=([^&]+)\b/)
    )
  )(createStore);

Подробнее о функции создания Redux нажмите здесь