arrow function syntax simplified

Kevin Smith khs4473 at gmail.com
Fri Mar 30 06:38:56 PDT 2012


>
> jQuery provides the same |this| value that you'd get using
> addEventListener, so this issue would exist in the DOM as well.
>

With addEventListener it's not as much of an issue, because you already
have a reference to the element in question when you register the event.

With jQuery, the |this| parameter is also duplicated as
event.currentTarget, which is admittedly a few more keystrokes:

    // This will work:
    $("body").on("click", e => $(e.currentTarget).hide());

    // Nothing wrong with classic, if you want dynamic this:
    $("body").on("click", function() { $(this).hide(); });

    // Or maybe change the framework to better take advantage of arrows?:
    $("body").on("click", e => $(e).hide());

FWIW, I randomly took a link from the jQuery home page (dell.com) and ran
the code on that site (from an inner page, not including jQuery itself)
through the analyzer, and added the results to the spreadsheet.  The
results are pretty typical:  64% BTF candidates, 79% BTF candidates or
object literal methods.

A couple of observations:

1)  Of course jQuery is hugely important in the javascript world, but that
doesn't necessarily mean that a hugely disproportionate share of function
expressions are jQuery event handlers which use |this|.

2)  Frameworks that currently use |this| as a general parameter passing
mechanism may find that there are better ways to pass that data, given
arrow functions and the ability of users to take advantage of lexical
|this|.

3)  There's nothing wrong with long-hand, if that's what you want.

kevin
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.mozilla.org/pipermail/es-discuss/attachments/20120330/717665df/attachment.html>


More information about the es-discuss mailing list