title: React.js understanding setState()
body: <p>I'm learning React.js and reading through react.js official docs. There is a example presented by the official docs, that I have questions for:</p>
  <p>original code:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>class Toggle extends React.Component {
    constructor(props) {
      super(props);
      this.state = {isToggleOn: true};
  
      // This binding is necessary to make `this` work in the callback
      this.handleClick = this.handleClick.bind(this);
    }
  
    handleClick() {
      this.setState(prevState =&gt; ({
        isToggleOn: !prevState.isToggleOn
      }));
    }
  
    render() {
      return (
        &lt;button onClick={this.handleClick}&gt;
          {this.state.isToggleOn ? 'ON' : 'OFF'}
        &lt;/button&gt;
      );
    }
  }
  
  ReactDOM.render(
    &lt;Toggle /&gt;,
    document.getElementById('root')
  );</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"&gt;&lt;/script&gt;
  &lt;div id="root"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>my question is :
  in the handleClick method, why can't this.setState be written as(without the arrow function):</p>
  <pre><code>handleClick() {
      this.setState({
        isToggleOn: !prevState.isToggleOn
      });
  }
  </code></pre>