JavaScript · this · Mid-Level · Best Practice
When should you use an arrow function vs a regular method regarding `this`?
Short Interview Answer
Use arrows to preserve outer `this` (callbacks); use regular functions/methods when you want `this` set by the receiver or `new`.
Detailed Explanation
Arrow functions shine as callbacks inside methods/constructors where you need the enclosing `this` (`this.setState` style). They cannot be used as constructors and have no `arguments` object (use rest). Object methods that should use the calling object as `this` should be regular methods — an arrow as an object literal method would capture the outer `this` (often `undefined`/global), which is usually wrong. Class fields as arrows bind per instance (convenient for React) but cost memory vs prototype methods.
Example
const obj = {
n: 1,
regular() { return this.n; },
arrow: () => this.n, // outer this, not obj
};
obj.regular(); // 1
obj.arrow(); // undefined (or global) in modules/strictInterview Tip
State a rule: 'arrows for lexical this, methods for dynamic this.'
Common Mistake
Using arrow functions for every object method 'because modern'.