What is a reducer in Redux?

Difficulty: 5/10

state updates, pure functions, action handling

A reducer is a pure function responsible for handling actions and returning a new state based on the previous state and the action that was dispatched.

1
A reducer is a function that receives the current state and an action object, decides how to update the state if necessary, and returns the new state: (state, action) => newState.
2
You can think of a reducer as an event listener that handles events based on the received action (event) type.

Here is an example of reducer function:

Reducers must always follow some specific rules:

1
They should only calculate the new state value based on the current state and action arguments.
2
They are not allowed to modify the existing state. Instead, they must make immutable updates, by copying the existing state and making changes to the copied values.
3
They must not do any asynchronous logic, calculate random values, or cause other "side effects" that is they must be pure functions

javascript

0-2 years experience

2-5 years experience

Difficulty: 5/10

state updates, pure functions, action handling

1
A reducer is a function that receives the current state and an action object, decides how to update the state if necessary, and returns the new state: (state, action) => newState.
2
You can think of a reducer as an event listener that handles events based on the received action (event) type.

Here is an example of reducer function:

Reducers must always follow some specific rules:

1
They should only calculate the new state value based on the current state and action arguments.
2
They are not allowed to modify the existing state. Instead, they must make immutable updates, by copying the existing state and making changes to the copied values.
3
They must not do any asynchronous logic, calculate random values, or cause other "side effects" that is they must be pure functions

javascript

0-2 years experience

2-5 years experience