title: React - Functional setState (previous state) different from new updated value?
body: <p>I'm currently trying to learn <code>React</code> by multiple recent courses.</p>
  
  <p>To update an state, most courses suggest going this way:</p>
  
  <pre><code> const updatedNinjas = [...this.state.ninjas, newNinja];
  
      this.setState({
        ninjas: updatedNinjas
      });
  </code></pre>
  
  <p>However, since <code>setState</code> is "asynchronous", the official <a href="https://reactjs.org/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous" rel="noreferrer">react documentation</a> recommends to use the previous state and update based on this one.</p>
  
  <pre><code>this.setState(prevState =&gt; ({
        ninjas: [...prevState.ninjas, newNinja]
      }));
  </code></pre>
  
  <p>Are both solving the same issue (since we use a new array each time in the first example) or is only the last one foolproof?</p>