Je nini actions na reducers, na kwa nini reducers lazima ziwe safi?

Question

Accepted Answer

**Action** ni kitu rahisi kinachofafanua *kile kilichotokea*; **reducer** ni kazi safi inayochukua hali ya sasa na action na kurejesha *hali* inayofuata. Pamoja zinarudia mabadiliko ya hali yanayotarajiwa.

## Actions — zinarafiki matukio

```js
// just data: a `type` (required) + any payload
{ type: "todos/added", payload: { id: 1, text: "Learn Redux" } }
{ type: "todos/toggled", payload: 1 }
```

Actions hazifanyi *kitu chochote* — ni maelezo ya kidamaskini ya matukio. Kuziita kwa wakati uliofika ("added", "toggled") kinaonyesha kuwa zinasajili kile kilichotokea.

## Reducers — zinahesabu hali inayofuata

```js
function todosReducer(state = [], action) {
  switch (action.type) {
    case "todos/added":
      return [...state, action.payload];              // new array
    case "todos/toggled":
      return state.map(t =>                             // new array, new object for the changed one
        t.id === action.payload ? { ...t, done: !t.done } : t
      );
    default:
      return state;                                     // unknown action → unchanged
  }
}
```

Maumbo ya reducer ni `(state, action) => newState`. Lazima irejesha kitu **kipya** chochote/array (kwa njia isiyobadilika), kamwe isibadilishe ingizo.

## Kwa nini reducers LAZIMA ziwe SAFI

Kazi safi: (1) inajesha matokeo sawa kwa ingizo sawa, na (2) haina **madhara ya upande**. Reducers lazima zifuate kanuni zote mbili:

```js
// ❌ NOT pure — breaks everything
function badReducer(state, action) {
  state.value++;              // ❌ mutates input (breaks change detection, time-travel)
  fetch("/api/log");          // ❌ side effect (non-deterministic, untestable)
  return { value: Math.random() }; // ❌ non-deterministic output
}
```

Usafi unaboresha sifa ya Redux:

```text
✓ Predictability   — same state + action ALWAYS gives the same result
✓ Time-travel / replay — you can re-run actions to reproduce any state
✓ Testability      — just call reducer(state, action) and assert; no mocks needed
✓ Change detection — returning new references lets the UI detect changes
```

Madhara ya upande (API simu, kuorodhesha, nasibu) hubaki katika **middleware** (thunks/sagas) au effects — kamwe si katika reducers.

## Kwa nini hii inafanya joto

Modeli wa action/reducer ni moyo wa usimamizi wa hali ya mtindo wa Redux na sababu inayosababisha kuwa na uweza wa kubaini na kupima.

Mwi wa usafi si wa kiholela: ni *nini kinachoboresha* time-travel debugging, action replay, na upimaji wa kawaida wa vitengo, na ni sababu madhara ya upande lazima yaishi mahali pengine.

Hii safi-kazi-inayosimamiwa, muundo wa sasisho usiotoshea unarudi katika Redux, NgRx, useReducer, na zaidi — kuelewa hii (na agizo la kutuza reducers safi) ni msingi wa hali inayotarajiwa.