Unbind arrow functions

Topics: General, Language Specification
Mar 31, 2014 at 12:50 PM
When using arrow functions to bind to event listeners, you will get the "_this" generated behind the scenes for you.
But how would you unbind it? an inline function is generated, and the event is now pointing to the inline function, you can't unbind it now... or can you?
Mar 31, 2014 at 4:44 PM
What does your code look like? The following works, try it out on the playground.

var button = document.createElement('button');
button.innerText = 'click'

var button2 = document.createElement('button');
button2.innerText = 'unbind'

class Foo {
    message = 'foobar';
        var handler = () =>{
        button.addEventListener('click', handler);
            button2.addEventListener('click', () =>{
            button.removeEventListener('click', handler);
var foo = new Foo();
Mar 31, 2014 at 7:13 PM
All you have to do is "= function() { ... }" instead, and "this" will not be affected. Things to keep in mind are that "this" is the global scope without an instance, or "undefined" when strict mode is being used.