Como acessar corretamente `this` dentro de uma callback function em JavaScript?
Olá a todos! Comecei a estudar JavaScript recentemente e me deparei com um problema que não consigo resolver. Tenho um objeto `user` com uma propriedade `name` e um método `greet`. Quero que o método `greet` exiba uma saudação com o nome do usuário após 2 segundos. Para isso, uso `setTimeout`. Mas quando executo o código, em vez do nome, aparece `undefined`. Aqui está meu código:
```javascript
const user = {
name: 'Ana',
greet: function() {
setTimeout(function() {
console.log(`Olá, ${this.name}!`);
}, 2000);
}
};
user.greet(); // Exibe "Olá, undefined!"
```
Entendo que o problema é que dentro da callback function no `setTimeout`, o contexto `this` é perdido. Mas não entendo por que isso acontece e como corrigir. Tentei ler a documentação, mas é muito complicada. Por favor, expliquem em palavras simples o que é `this` em JavaScript e como passá-lo corretamente para a callback. Agradeço exemplos com explicações!
<<>>