title: Why binding is needed in ES6 react classes
body: <p>In new React ES6 classes <code>this</code> needs to be binded as stated here: <a href="http://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#autobinding" rel="noreferrer">http://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#autobinding</a>
  for eg:</p>
  
  <pre><code>class Counter extends React.Component {
    constructor() {
      super();
      this.tick = this.tick.bind(this);
    }
    tick() {
      ...
    }
    ...
  }
  </code></pre>
  
  <p>The explanation for this is because it's the default behaviour, however if I make an ES6 class and then I make a new instance of it <code>this</code> will be binded</p>
  
  <pre><code>import React from 'React'
  
  class Test extends React.Component {
      constructor() {
        super()
      }
      foo () {
        console.log('bar')
      }
      hello() {
        this.foo()
      }
  }
  
  var test = new Test()
  test.hello()
  // &gt; bar
  </code></pre>
  
  <p>Why binding is needed in React then?</p>