Você aprendeu que classes são como plantas que você pode usar para criar objetos. Esses blueprints precisam de uma forma geral de se referir ao objeto específico que está sendo criado, acessado ou modificado dentro do código. É exatamente para isso que a palavra-chave this é usada. Refere-se ao contexto onde o código deve ser executado. Se você usá-lo dentro de um método, o valor de this será uma referência ao objeto associado àquele método. Dessa forma, você pode acessar as propriedades e métodos do objeto dentro da classe e reutilizar o método em diferentes objetos. Por exemplo, aqui temos uma classe Dessert. Desta vez, estamos definindo uma propriedade hasPeanuts.

class Dessert {
  constructor(hasPeanuts) {
    this.hasPeanuts = hasPeanuts;
  }
}

Observe que estamos usando a palavra-chave this dentro do construtor. Lembre-se de que o construtor é chamado automaticamente quando um novo objeto da classe é criado. A palavra-chave this está informando ao programa que hasPeanuts deve ser uma propriedade do objeto que está sendo criado no momento. O lado direito da instrução de atribuição está atribuindo o valor do parâmetro hasPeanuts à propriedade hasPeanuts do novo objeto.

this.hasPeanuts = hasPeanuts;

Isso está no contexto do construtor mas você também pode usar a palavra-chave this dentro de outros métodos. Esta é a nossa classe Dessert com algumas mudanças. Agora temos duas propriedades: name e price.

class Dessert {
  constructor(name, price) {
    this.name = name;
    this.price = price;
  }

  showPrice() {
    console.log(The price of ${this.name} is $${this.price}.);
  }
}

Também temos um novo método showPrice. Neste método, imprimimos uma mensagem descritiva no console com o nome e o preço do objeto dessert. Note como estamos usando a palavra-chave this para acessar as propriedades do objeto dentro do método showPrice. Qual valor a palavra-chave this terá no contexto deste método? Ele se referirá ao objeto no qual o método está sendo chamado. In this case, we're creating a new Dessert instance with the name "Brownie" and the price $5.99:

const brownie = new Dessert("Brownie", 5.99);

Se chamarmos o método .showPrice() neste objeto:

brownie.showPrice();

Aqui está o exemplo completo:

class Dessert {
  constructor(name, price) {
    this.name = name;
    this.price = price;
  }

  showPrice() {
    console.log(The price of ${this.name} is $${this.price}.);
  }
}

const brownie = new Dessert("Brownie", 5.99);
brownie.showPrice();
console.log(brownie);

O nome e o preço do objeto atual (brownie) são substituídos na string. Tudo isso é graças à palavra-chave this, que lhe dá uma forma geral de se referir ao objeto atual dentro da classe. Isso permite que você reutilize o método em diferentes objetos. Isso está no contexto de métodos de objeto mas a palavra-chave this também terá um valor em funções independentes e funções arrow. Seu valor dentro de uma função independente normalmente se refere ao objeto global (no modo não estrito) ou undefined (no modo estrito). O valor da palavra-chave this é um pouco diferente em funções arrow. Funções arrow herdam o valor de this do escopo envolvente onde são definidas. Eles não criam sua própria ligação de this. Isso significa que o valor de this depende do contexto onde a arrow function é definida, não de onde ou como a arrow function é chamada. Isso torna as funções arrow úteis para callbacks ou para preservar o contexto. No entanto, por causa disso, o valor de this não se referirá ao objeto atual em métodos de objeto, então isso é algo que você deve ter em mente ao trabalhar com funções arrow. O mesmo se aplica às funções arrow definidas dentro de outras funções. Eles herdarão o valor de this do seu escopo pai. A palavra-chave this é uma ferramenta poderosa para acessar e manipular objetos. Entender como funciona é essencial para dominar a programação orientada a objetos em JavaScript.