The answer
The method is detached from the object. Calling it as a plain function (const { greet } = obj; greet()) loses this. Call it on the object (obj.greet()) or bind it first.
this Keyword Pitfalls and Fixes in JavaScript
What happens when you destructure a method from an object in JavaScript?
More FAQs in this Keyword Pitfalls and Fixes in JavaScript
Lost this in callbacks, arrow methods on objects (lexical this), forgetting new, this in setTimeout/forEach inside methods, destructured methods (detached), and expecting arrows to have object this.
Use .bind(obj) to permanently bind this, or wrap the method call in an arrow function (() => obj.method()). Arrows inherit this lexically from the enclosing scope, so they preserve the correct binding.
Because an arrow function's this is the enclosing scope's this, not the object. So obj.greet = () => this.name gives undefined. Use regular functions for methods so this is the object.
Still have questions?
Browse all our FAQs or reach out to our support team
Want to upskill yourself?
Your learning library
Small steps. Big possibilities.
Find your next course. Build something great.