Estoy tratando de usar el sistema de eventos Vanilla JS para enviar eventos entre diferentes componentes de la aplicación de mi navegador (sin involucrar a NodeJS), enviando eventos al objeto de la window .

 // method in Class A sendDone() { window.dispatchEvent(new Event('done'); }

En otra clase, tengo un método que maneja el detector opcional de este evento, que el usuario puede habilitar/deshabilitar.

 // method in Class B setOption(shouldListen) { if (shouldListen) { window.addEventListener('done', this.doneHandler); } else { window.removeEventListener('done', this.doneHandler); } }

Sin embargo, el controlador obtiene el contexto de la window en lugar del contexto de la instancia, y this palabra clave no funciona como me gustaría:

 // method in Class B doneHandler() { this.someMethod(this.someValue); // doesn't work }

No puedo pasar this al controlador con una función anónima porque no puedo eliminar una función anónima de la lista de oyentes. Por la misma razón, no puedo incluir el código del controlador dentro de la definición de la función, así:

 const self = this; window.addEventListener('done', function() { // can use self here instead // but listener still can't be removed });

Soy nuevo en JS y me pregunto cómo se maneja este tipo de escenario.

Gracias.