title: How to use "this" of class in "callbacks" in ES6?
body: <p>I'm using Babel with ES2015. And want to use <code>this</code> inside <code>callback</code> inside method.</p>
  
  <pre><code>class baz {
    bar = "xxx";
    foo() {
      x(function() {
        console.log(this.bar);
      });
    }
  }
  
  function x(callback) {
    return callback();
  }
  var y = new baz();
  y.foo();
  </code></pre>
  
  <p><a href="https://jsfiddle.net/dnthehnt/7/" rel="nofollow">https://jsfiddle.net/dnthehnt/7/</a>
  I'm getting</p>
  
  <blockquote>
    <p>TypeError: this is undefined</p>
  </blockquote>
  
  <p>because as far as I understand this refers to the callback function in <code>x()</code>. As a solution I use </p>
  
  <pre><code>class baz {
    bar = "xxx";
    foo() {
      var bar = this.bar;//&lt;=====
      x(function() {
        console.log(bar);//&lt;=====
      });
    }
  }
  
  function x(callback) {
    return callback();
  }
  var y = new baz();
  y.foo();
  </code></pre>
  
  <p><a href="https://jsfiddle.net/dnthehnt/6/" rel="nofollow">https://jsfiddle.net/dnthehnt/6/</a> 
  And get</p>
  
  <blockquote>
    <p>xxx</p>
  </blockquote>
  
  <p>This is solution, but if you have mass of code it's getting very confusing and hard to write. Is there any better solution for using <code>this</code>? Or any other discipline for ES6 for using callbacks and this.</p>