Equivalent of 'this' inside lambda function

Question

I have a function like:

$(".myDropdown").hover(function() {
 $(this).find(".myDropdown-caretDown").hide();
}, function() {
 $(this).find(".myDropdown-caretDown").show();
});

If I want to use lambda function for hover callback, What can I use instead of this?

• Igor: this inside arrow function is the same object as this in the scope that defines the arrow function
• arbuthnott: One of the main ideas of arrow function is that this is not redefined from the parent context. If you need this don't use arrow functions.
• Tyler Roper: @Igor I believe that's why OP's asking the question. OP, my question is simply... why? Why go out of your way to do something that will require more work and isn't meant for that purpose? If I were following up a project and saw someone use arrow functions for event bindings I think I'd pull my hair out.
• BlackJack: @Mhd: I was confused by the question until I've read the comments: You are using lambda functions, that's anonymous functions, i.e. functions without a name. Your question seems about arrow functions, which are also anonymous functions but with a different syntax and semantic regarding the value of this. Maybe you should edit the question and title accordingly to avoid this confusion.

Answer 1

this inside arrow function is the same object as this in the scope that defines this function:

$(".myDropdown").hover(
 e => $(e.target).find(".myDropdown-caretDown").hide(),
 ...
});

• Mhd: For this specific example, I can use event, but in general way, I can't use lambda function?
• Igor: "can't use lambda function" - for what?
• Mhd: Use lambda function and get access to this that refers to this function
• Tyler Roper: @Mhd You use a lambda/arrow function specifically when you don't want a local this, hence my comment above about this being a questionable approach.

Answer 2

What can I use instead of this?

Use event.target

$(".myDropdown").hover('click', (event) => {
 $(event.currentTarget).find(".myDropdown-caretDown").hide();
 },(event) => {
 $(event.currentTarget).find(".myDropdown-caretDown").show();
 },);

• Mhd: In more general way, I can't use lambda function if I need this of local function?
• gurvinder372: @Mhd with lamda function, scope of this is defined by the object that defines this lamda function. So, in your case it will belong to the function that defines this hover event-handler.