this is dynamic. It changes based on how a function is called.
Explicit Binding
Forcing the Context
Sometimes you want to force a function to use a specific object as this. We use .call() or .bind().
javascript
const person1 = { name: "Alice" };
const person2 = { name: "Bob" };
function introduce(interest) {
console.log(`Hi, I am ${this.name} and I like ${interest}.`);
}
// 1. Call: Invokes immediately
introduce.call(person1, "Coding");
// 2. Bind: Returns a NEW function to use later
// Very useful in React event handlers!
const bobIntro = introduce.bind(person2);
bobIntro("Gaming");Arrow Functions
Arrow functions don't care about binding. They just use the this from the surrounding code (Lexical Scoping). This is why we use them in React components.