How `this` Is Determined
Unlike lexical variables, this is generally determined by how a function is called. With a normal function, the call site matters. obj.method() gives this as obj. A standalone call in strict mode gives undefined. call, apply, and bind can explicitly control this.
Arrow functions are different: they do not create their own this; they capture this lexically from their surrounding context.
Method vs Detached Function
const user = {
name: 'Suriya',
greet() {
return this.name;
}
};
console.log(user.greet());
const greet = user.greet;
console.log(greet());💡 The first call has user as its receiver. The detached call no longer has that receiver, so in strict mode this is undefined and accessing this.name throws.
Key Takeaways
thisis not simply the same thing as lexical scope.- Normal function this depends on invocation.
- Arrow functions capture this lexically.
Knowledge Check
What does an arrow function do with `this`?