Explique como `this` funciona em JavaScript
Não há uma explicação simples para this; ela é um dos conceitos mais confusos do JavaScript. Uma explicação superficial é que o valor do this depende de como a função é chamada. Tendo lido muitas explicações sobre this online, Arnav Aggrawal é a explicação que foi mais clara. As seguintes regras se aplicam:
- Se a palavra-chave
newé usada ao chamar a função,newdentro da função é um objeto totalmente novo. - Se
apply,call, oubindforem usados para chamar/criar uma função,thisdentro da função é o objeto passado como o argumento. - Se uma função é chamada como um método, como
obj.method()—thisé o objeto do qual a função é uma propriedade. - Se uma função é chamada como uma chamada de função livre, significando que ele foi invocado sem nenhuma das condições presentes acima,
thisé o objeto global. Em um navegador, é o objetowindow. Se em modo estrito ('use strict'),thisseráundefinedem vez do objeto global. - Se se aplicarem múltiplas das regras acima, a regra que é maior ganha e definirá o valor
this. - Se a função é uma arrow function ES2015, ela ignora todas as regras acima e recebe o valor
thisdo seu escopo circundante no momento em que ele é criado.
Para uma explicação aprofundada, confira o artigo na Medium.
Você pode dar um exemplo de uma das maneiras como o trabalho com "this" mudou no ES2015?
ES2015 permite que você use arrow functions que usa o enclosing lexical scope. Isso geralmente é conveniente, mas impede quem chamou de controlar o contexto através de .call ou .apply—as consequências são que uma biblioteca como jQuery não irá vincular corretamente o this em suas funções de manipulador de eventos. Portanto, é importante ter isso em mente ao refatorar grandes aplicações legadas.