title: React onChange functions with ES6 arrows or not
body: <p>When handling an <code>onChange</code> event, this one works:</p>
  <pre><code>&lt;input type=&quot;file&quot; onChange={this.onChange}
  </code></pre>
  <p>Not this one, that executes instantaneously the function:</p>
  <pre><code>&lt;input type=&quot;file&quot; onChange={this.onChange()}
  </code></pre>
  <p>Not this other one, doesn't execute:</p>
  <pre><code>&lt;input type=&quot;file&quot; onChange={() =&gt; this.onChange}
  </code></pre>
  <p>But this one does:</p>
  <pre><code>&lt;input type=&quot;file&quot; onChange={() =&gt; this.onChange()}
  </code></pre>
  <p>But, while the first one automatically sends the <em>event</em> object, the second one needs to explicitly send it:</p>
  <pre><code>&lt;input type=&quot;file&quot; onChange={(e) =&gt; this.onChange(e)}
  onChange(e) {
      console.log(e.target.files[0])
  }
  </code></pre>
  <p>Why is that? and when should we use one or the another?</p>