title: TypeScript and Redux: Why do I need to add ` | undefined` to my Reducer state type?
body: <p>Why can I not just type my reducer simply like this, without adding " | undefined" to my redux state type? </p>
  
  <pre><code>const reducer: Reducer&lt;ReduxState&gt; = function(state: ReduxState, action: any) ...
  </code></pre>
  
  <p>Extra context:::: </p>
  
  <p>This works OK: </p>
  
  <pre><code>export const reducer: Reducer&lt;ReduxState | undefined&gt; = function (
      state: ReduxState | undefined, 
      action: any
  ) {
      return state
  }
  export default reducer
  </code></pre>
  
  <p>However, it doesnt when taking away state parameter "undefined" from fxn: </p>
  
  <pre><code>export const reducer: Reducer&lt;ReduxState | undefined&gt; = function (
      state: ReduxState, 
      action: any
  ) {
      return state
  }
  export default reducer
  </code></pre>
  
  <p>Which gives an error of:</p>
  
  <pre><code>Type '(state: ReduxState, action: any) =&gt; ReduxState' is not assignable to type 'Reducer&lt;ReduxState | undefined, AnyAction&gt;'.
    Types of parameters 'state' and 'state' are incompatible.
      Type 'ReduxState | undefined' is not assignable to type 'ReduxState'.
        Type 'undefined' is not assignable to type 'ReduxState'.ts(2322)
  </code></pre>
  
  <p>Or this: </p>
  
  <pre><code>export const reducer: Reducer&lt;ReduxState&gt; = function (
      state: ReduxState | undefined, 
      action: any
  ) {
      return state
  }
  export default reducer
  </code></pre>
  
  <p>which gives an error msg of: </p>
  
  <pre><code>Type '(state: ReduxState | undefined, action: any) =&gt; ReduxState | undefined' is not assignable to type 'Reducer&lt;ReduxState, AnyAction&gt;'.
    Type 'ReduxState | undefined' is not assignable to type 'ReduxState'.
      Type 'undefined' is not assignable to type 'ReduxState'.ts(2322)
  </code></pre>
  
  <p>And lastly, this doesn't work either: </p>
  
  <pre><code>import {ReduxState, ReduxAction, ReduxActionType} from './types'
  import {Reducer} from 'redux'
  
  export const reducer: Reducer&lt;ReduxState&gt; = function (
      state: ReduxState, 
      action: any
  ) {
      return state
  }
  export default reducer
  </code></pre>
  
  <p>With an error msg of : </p>
  
  <p><code>Type '(state: ReduxState, action: any) =&gt; ReduxState' is not assignable to type 'Reducer&lt;ReduxState, AnyAction&gt;'.
    Types of parameters 'state' and 'state' are incompatible.
      Type 'ReduxState | undefined' is not assignable to type 'ReduxState'.
        Type 'undefined' is not assignable to type 'ReduxState'.ts(2322)</code></p>
  
  <p>TL; DR:  Typescript isn't happy with my Reducer unless I specifically allow "ReduxState | undefined" type in both the <code>Reducer&lt;ReduxState|undefined&gt;</code> and <code>function(state: ReduxState | undefined)</code>. </p>