title: Node.js EventEmitter: How to bind a class context to the event listener and then remove this listener
body: <p>Is there a way to access to the class context in the event listener method with possibility to remove the listener?</p>
  
  <p><strong>Example 1:</strong></p>
  
  <pre><code>import {EventEmitter} from "events";
  
  export default class EventsExample1 {
      private emitter: EventEmitter;
  
      constructor(private text: string) {
          this.emitter = new EventEmitter();
  
          this.emitter.addListener("test", this.handleTestEvent);
          this.emitter.emit("test");
      }
  
  
      public dispose() {
          this.emitter.removeListener("test", this.handleTestEvent);
      }
  
      private handleTestEvent() {
          console.log(this.text);
      }
  }
  </code></pre>
  
  <p>In this example removing the listener works, but the <code>handleTestEvent()</code>method has no access to the class context using <code>this</code>. <code>this</code> points to EventEmitter context, so <code>this.text</code> is not accessible.</p>
  
  <p><strong>Example 2:</strong></p>
  
  <pre><code>import {EventEmitter} from "events";
  
  export default class EventsExample2 {
      private emitter: EventEmitter;
  
      constructor(private text: string) {
          this.emitter = new EventEmitter();
  
          this.emitter.addListener("test", this.handleTestEvent.bind(this));
          this.emitter.emit("test");
      }
  
      public dispose() {
          this.emitter.removeListener("test", this.handleTestEvent);
      }
  
      private handleTestEvent() {
          console.log(this.text);
      }
  }
  </code></pre>
  
  <p>In this example, I'm using the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind" rel="noreferrer"><code>bind</code></a> function to bind a context of the class to the event listener. Now <code>handleTestEvent</code> method has access to the class context using <code>this</code> => <code>this.text</code> is accessible, but listener cannot be removed with <a href="https://nodejs.org/api/events.html#events_emitter_removelistener_eventname_listener" rel="noreferrer"><code>removeListener</code></a> - it seems that <code>bind</code> creates a new anonymous function, so there is no reference to the bounded listener.</p>
  
  <p><strong>Example 3:</strong></p>
  
  <pre><code>import {EventEmitter} from "events";
  
  export default class EventsExample3 {
      private emitter: EventEmitter;
  
      constructor(private text: string) {
          this.emitter = new EventEmitter();
  
          this.emitter.addListener("test", () =&gt; this.handleTestEvent());
          this.emitter.emit("test");
      }
  
      public dispose() {
          this.emitter.removeListener("test", this.handleTestEvent);
      }
  
      private handleTestEvent() {
          console.log(this.text);
      }
  }
  </code></pre>
  
  <p>In this example, I'm using an arrow function to preserve a context of the class in the event listener. <code>handleTestEvent</code> method has access to the class context using <code>this</code>, but listener cannot be removed (there is no reference to the bounded listener as in example 2).</p>
  
  <p>I've tried an alternative event library - <a href="https://github.com/primus/eventemitter3" rel="noreferrer">EventEmitter3</a> which has a support for custom context for events (class context can be passed as third parameter to the <code>addListener</code> function (<code>this.emitter.addListener("test", this.handleTestEvent, this</code>), it works perfectly, but I rather want to use the included <a href="https://nodejs.org/api/events.html" rel="noreferrer">EventEmitter</a> from Node.js.</p>