title: How does spread operator work in an array vs. obj?
body: <p>I'm learning Redux from this <a href="https://scotch.io/tutorials/build-a-media-library-with-react-redux-and-redux-saga-part-2#toc-step-1-of-8-define-endpoints-of-interest" rel="nofollow noreferrer">tutorial</a> and I don't get how the spread operator below works in both the object and array. If <code>...state</code> returns the same thing, how can it work in both situations? I thought it will just return an array, so it will work inside the <code>SHUTTER_VIDEO_SUCCESS</code> because it'll just spread whatever is inside the state into the new array in addition to the <code>action.videos</code>, but how will this work inside the <code>SELECTED_VIDEO</code> case? There is no key to place it in. The spread operator grabs the array not the key value pair from the default <code>initialState</code> right?</p>
  
  <p><strong>initialState.js</strong></p>
  
  <pre><code>export default {
    images: [],
    videos: []
  };
  </code></pre>
  
  <p><strong>someComponent.js</strong></p>
  
  <pre><code>import initialState from './initialState';
  import * as types from 'constants/actionTypes';
  
  export default function ( state = initialState.videos, action ) {
    switch (action.type) {
      case types.SELECTED_VIDEO:
        return { ...state, selectedVideo: action.video }
      case types.SHUTTER_VIDEO_SUCCESS:
        return [...state, action.videos];
      default:
        return state;
    }
  }
  </code></pre>