Skip to main content

 

compose(...functions)

Overview

Composes functions from right to left.

This is a functional programming utility, and is included in Redux as a convenience. You might want to use it to apply several store enhancers in a row. compose is also usable as a general-purpose standalone method.

Redux Toolkit

This page describes the low-level Redux mechanism that Redux Toolkit builds on. In an application, you would normally use Redux Toolkit's configureStore and createSlice rather than writing this code yourself. It's still worth understanding what they do underneath.

To learn how to write Redux apps today, see the Redux Essentials tutorial. To update existing code, see Migrating to Modern Redux.

You shouldn't have to call compose directly. configureStore sets up the standard applyMiddleware and Redux DevTools store enhancers, and offers an enhancers callback for adding more.

Arguments

  1. (arguments): The functions to compose. Each function is expected to accept a single parameter. Its return value will be provided as an argument to the function standing to the left, and so on. The exception is the right-most argument which can accept multiple parameters, as it will provide the signature for the resulting composed function.

Returns

(Function): The final function obtained by composing the given functions from right to left.

Example

This example demonstrates how to use compose to enhance a store with applyMiddleware and a second store enhancer. The enhancers are applied from right to left, so applyMiddleware wraps the store that persistEnhancer produced.

import { createStore, applyMiddleware, compose } from 'redux'
import { thunk } from 'redux-thunk'
import { persistEnhancer } from './enhancers/persist'
import reducer from '../reducers'

const store = createStore(
reducer,
compose(applyMiddleware(thunk), persistEnhancer)
)

Tips

  • All compose does is let you write deeply nested function transformations without the rightward drift of the code. Don't give it too much credit!