Boa noite a todos,
Gostaria de saber se existe algum momentos que eu não devo usar arrow-function? Quando não é indicado e/ou quando é indicado?
Att. Vinicius
Boa noite a todos,
Gostaria de saber se existe algum momentos que eu não devo usar arrow-function? Quando não é indicado e/ou quando é indicado?
Att. Vinicius
Oi Vinicius, beleza?
Quando você não quer herdar o this e sim definir um novo valor para o this então é necessário usar a notação de function.
Um exemplo bem raso, mas que ajuda na compreensão de sua pergunta, é caso você esteja trabalhando dentro do console do browser onde o this referência o objeto Window. Se você usar arrow functions corre o risco de sobrescrever alguma propriedade do objeto Window, por que as arrow functions não tem seuthis próprio. Já usando a notação defunction poderá trabalhar tranquilamente por que um novo this será criado no contexto dessa função.
Acabou duplicando a resposta aqui.
A Arrow Function não possui o seu próprio contexto de execução.
Por exemplo:
const button = document.querySelector('#click_here');
button.addEventListener('click', () => {
this.classList.toggle('on');
});Esse código não funcionaria corretamente pois o this não referencia o document. Nesse contexto o certo seria utilizar function(), Veja o exemplo:
const button = document.querySelector('#click_here');
button.addEventListener('click', function() => {
this.classList.toggle('on');
});Concluindo: A utilização da Arrow Function, vai depender de como você quer utilizar o this.
Você pode se aprofundar mais, lendo a documentação em: MDN Web Docs