Ask any question about JavaScript here... and get an instant response.
Post this Question & Answer:
Why does `this` behave differently inside an arrow function compared to a regular function?
Asked on May 27, 2026
Answer
Arrow functions in JavaScript do not have their own "this" context; they inherit "this" from the surrounding lexical scope. In contrast, regular functions have their own "this" context based on how they are called.
const obj = {
regularFunction: function() {
console.log(this); // "this" refers to obj
},
arrowFunction: () => {
console.log(this); // "this" refers to the global object or undefined in strict mode
}
};
obj.regularFunction(); // Logs obj
obj.arrowFunction(); // Logs global object or undefinedAdditional Comment:
✅ Answered with JavaScript best practices.- Arrow functions are useful when you want to preserve the "this" value from the surrounding context.
- Regular functions are more flexible if you need to define a new "this" context.
- Be cautious when using arrow functions as methods in objects, as they may not behave as expected with "this".
Recommended Links:
