Jquery with arrow function

Question

I apologise if this is a duplicate. Im a little confused as to what the difference is with this

$('.child_panel').on('click', () => {
         console.log(this);
});

and with this

$('.child_panel').on('click', function() {
             console.log(this);
    });

To it seems that the binding to of the context to this is only occurring in the second case and not the first. Can someone please explain what the difference is and what the proper way to do it would be in the case of the arrow function.

Thanks!

score 3 · Accepted Answer · answered Jul 20 '17 at 01:11

from https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions

An arrow function expression has a shorter syntax than a function expression and does not bind its own this, arguments, super, or new.target. These function expressions are best suited for non-method functions, and they cannot be used as constructors.

Jquery with arrow function

1 Answers1