o que é um Arrow Function?
Esse tipo de construir funções surgiu no ES6, ecmascript 2015. E desde então, tem ganhado cada vez mais repercussão devido a objetividade e a forma de ser utilizada.
características principais
São funções anônimas e por isso, explica o porque de serem muito utilizadas como função de callback.
Tratam o this de forma diferente da tradicional.
A sintaxe das arrow functions também é algo que caracteriza.
Como são funções anônimas, nas situações que há a necessidade de nomeá-las, então devemos atribuir a uma constante.
Comparado com uma função tradicional, a percepção é imediata já na sintaxe.
Importante: As arrow functions não foram criadas apenas para reduzir as linhas de código em suas sintaxes.
Tratam o this de forma completamente diferente tradicional. Redefine como é tratado dentro da função e por isso, altera o seu uso.
Vamos a mais um exemplo
Comparando a forma de criação e o resultado quando estamos trabalhando com o this, tratam this de maneira completamente diferente que funções “normais”.
Arrow functions redefinem como this é tratado dentro da função e, consequentemente, altera completamente seu uso.
Na documentação oficial temos ainda mais detalhes.
Arrow Functions vs. Functions
Uma expressão arrow function possui uma sintaxe mais curta quando comparada a uma expressão de função (function expression).
Arrow function não tem seu próprio this, arguments, super ou new.target. Estas expressões de funções são melhor aplicadas para funções que não sejam métodos, e não podem ser usadas como construtoras (constructors).
Uma arrow function não tem seu próprio this; o valor this do contexto léxico encapsulado é usado.
Ex: Arrow functions seguem as regras normais de pesquisa de variáveis. Então, ao procurar por this, que não está no escopo atual elas acabam encontrando this no escopo encapsulado.
Assim, no código a seguir, o this dentro da função que é passado para setInterval tem o mesmo valor do this na função lexicamente encapsulada:
Arrow functions usadas como métodos
Como afirmado anteriormente, expressões arrow function são melhores para funções que não sejam metods.
Vamos ver o que acontece quando tentamos usá-las como métodos.
No trecho acima, na Linha 11, imprime undefined, Window {…} (ou o objeto global) e na Linha 12, imprime 10, Object {…}.
No artigo a seguir, também tem alguns detalhes interessantes sobre arrow funcion e function tradicional.
Esse artigo ficou menor que os demais, mas a intenção é tratar situações mais específicas nesse tipo de tema técnico e prático. Tomara que tenha gostado, aplauda o artigo! Até o próximo artigo e ótimos códigos.
