How to create a store using pure functions

Pure functions produce the same output value, given the same input. They have no side-effects, and are easier to read, understand and test.

Given all this, I would like to create a store that hides the state but at the same time uses pure functions.

Pure functions don’t modify their input. They treat the input values as immutable.

An immutable value is a value that, once created, cannot be changed.

Immutable.js provides immutable data structures like List. An immutable data structure will create a new data structure at each action.

Consider the next code:

import { List } from "immutable";
const list = List();
const newList = list.push(1);

push() creates a new list that has the new element. It doesn’t modify the existing list.

delete() returns a new List where the element at the specified index was removed.

The List data structure offers a nice interface for working with lists in an immutable way, so I will use it as the state value.

The store manages state.

State is data that can change. The store hides that state data and offers a public set of methods for working with it.

I would like to create a book store with the add(), remove() and getBy() methods.

I want all these functions to be pure functions.

There will be two kind of pure functions used by the store:

Both these kinds of functions will take the state as their first parameter.

For more on applying functional programming techniques in React take a look at Functional React.

Learn functional React, in a project-based way, with Functional Architecture with React and Redux.