Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript One Solution

Posted by Jesse Vorvick
Jesse Vorvick
6,047 Points

Arrow function won't work/backtick questions

The teacher's code on step 3 is the following:

$('ul').on('dblclick', 'li', function() {
  $(this).toggleClass('strike');
});

However, when trying to use arrow functions, it doesn't work:

$('ul').on('dblclick', 'li', () => {
  $(this).toggleClass('strike');
});

Playing around with it, I'm pretty sure it's because of the 'this' keyword. For example, if I used e.target instead, it works fine. Can anyone confirm/explain why?

Second question: the teacher used backticks in the second step: $('ul').append(<li>${$newInput}</li>);. Is it now standard to use backticks anywhere there would be quotes in JavaScript? Or just specific locations? Aren't we up to ES 7 or 8 now??

1 Answer

Steven Parker
Steven Parker
220,425 Points
Steven Parker
Steven Parker
220,425 Points

You're exactly right, arrow functions work a bit differently; and one difference is that they don't establish a "this" like conventional functions do. There are some purposes for which they cannot be used as replacements. For more details, see this MDN page on Arrow Functions.

And backticks aren't intended as replacements for quotes. They should be used to create template literals, which would contain substitution tokens for interpolation. MDN also has a page on Template Literals.