Why is a Redux reducer called a reducer?
<p>Whilst learning <code>Redux</code> I've came across <code>Reducers</code>. The documentation states:</p>

<blockquote>
  <p>The reducer is a pure function that takes the previous state and an action, and returns the next state. (previousState, action) => newState. It's called a reducer because it's the type of function you would pass to Array.prototype.reduce(reducer, ?initialValue) .</p>
</blockquote>

<p>MDN describes the <code>reduce</code> method as:</p>

<blockquote>
  <p>The reduce() method applies a function against an accumulator and each value of the array (from left-to-right) to reduce it to a single value.</p>
</blockquote>

<p>I'm still confused on why the Redux definition of a reducer as it's making no sense. Secondly the MDN description doesn't seem correct either. The <code>reduce</code> method isn't always used to reduce to a single value. It can be used in place of <code>map</code> and <code>filter</code> and is actually faster when used in place of chaining.</p>

<p>Is the MDN description incorrect?</p>

<p>Jumping back to the Redux definition of a reducer, it states:</p>

<blockquote>
  <p>It's called a reducer because it's the type of function you would pass to Array.prototype.reduce(reducer, ?initialValue)</p>
</blockquote>

<p>I'm under the impression that a reducer in Redux is responsible for modifying state. An example reducer:</p>

<pre><code>const count = function(state, action) {
    if(action.type == 'INCREMENT') {
        return state + 1;
    } else if(action.type == 'DECREMENT') {
        return state - 1;
    } else {
        return state;
    }
}
</code></pre>

<p>... I don't see how this is a function that would be passed to <code>reduce</code>. How is that data being reduced to a single value? If this is a function you would pass to <code>reduce</code> then <code>state</code> would be the callback and <code>action</code> would be the initial value. </p>

<p>Thanks for any clear explanations. It's difficult to conceptualize.</p>