title: Use a class method to set a listener callback with 'this' being the class instance that ran the method
body: <p>Here's what I'm trying to do:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>class foo{
    constructor(){
      this.num = 1;
      }
    log() {console.log(this.num)}
    assign() {
        document.querySelector('div').onclick = this.log
    }
  }
  
  let bar =  new foo();
  bar.assign()
  
  /* Click */ // goal: 1, actual: undefined</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;Click Me&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>When the class method runs, its scope is the HTML object itself, so <code>this.num</code> doesn't exist. How can I link the <code>this</code> of the callback to the class instance that set the listener, in this case <code>bar</code></p>