Care sunt acțiunile și reducerii, și de ce trebuie ca reducerii să fie funcții pure?

Question

IT Interview Practice · Accepted Answer

O **acțiune** este un obiect simplu care descrie *ce s-a întâmplat*; un **reducer** este o funcție pură care primește starea curentă și o acțiune și returnează starea *următoare*. Împreună implementează tranzițiile de stare predictibile.

## Acțiuni — descriu evenimente

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

Acțiunile nu *fac* nimic — sunt descrieri declarative ale evenimentelor. Denumirea lor în timp trecut („adăugat", "comutat") reflectă faptul că înregistrează ce s-a întâmplat.

## Reducerii — calculează starea următoare

```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
  }
}
```

Semnătura unui reducer este `(state, action) => newState`. Trebuie să returneze un nou obiect/array de stare (imutabil), niciodată să nu modifice intrarea.

## De ce reducerii TREBUIE să fie funcții pure

O funcție pură: (1) returnează același rezultat pentru aceeași intrare, și (2) nu are **efecte secundare**. Reducerii trebuie să respecte ambele reguli:

```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
}
```

Puritatea permite caracteristicile distinctive 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
```

Efectele secundare (apeluri API, logging, aleatorie) aparțin **middleware**-ului (thunks/sagas) sau efectelor — niciodată în reduceri.

## De ce conteaza

Modelul acțiune/reducer este inima managementului de stare în stil Redux și motivul pentru care este atât de ușor de debugat și testat.

Cerința de puritate nu este arbitrară: este *ceea ce face* debugarea în timp invers, redare acțiuni și testare unitară trivială posibilă, și de aceea efectele secundare trebuie să trăiască în alt loc.

Acest model pur de funcție, imutabil, de actualizare recurge peste Redux, NgRx, useReducer și dincolo — înțelegerea lui (și disciplina menținerii reducerilor puri) este fundamentală pentru starea predictibilă.

Acțiuni — descriu evenimente

Reducerii — calculează starea următoare

De ce reducerii TREBUIE să fie funcții pure

De ce conteaza

Întrebări conexe