Diário de bordo #7

Arrow Functions

Com as atualizações do ES6 do ECMAScript em 2015, nos foram trazidas várias novas funcionalidades interessantes, e uma das que mais se destacaram e que eu as vejo serem bastante utilizadas, foram as Arrow Functions. Que são uma forma mais simples, poderoza e bastante eficiente de utilizar funções em JavaScript.

Sintaxe

Uma função na qual formos apresentados convêncionalmente quando aprendemos javaScript tem esse escopo function nomeDaFuncao(){}, já as Arrow functions são definidas a partir deste escopo () => {}, onde o => faz referência flecha, fazendo jus ao nome dado a esse tipo de função.

Para que serve?

As Arrow Functions são uma forma mais elegante e atualizada de declarar funções em JavaScript, como foi mencionado nos primeiros paragrafos do artigo. Elas nos traz várias possibildades que podem melhorar a legibilidade e usabilidade do nosso código, tais dessas possibilidades são: Refatoração de código, código enxuto e limpo (clean code), além de nos ajudar nas desestruturações.

Veja um exemplo de código refatorado utilizando esse recurso do JavaScript

function saveDay() { // Código Antigo utilizando uma maneira "antiga" de declarar funções em JavaScript
  localStorage.setItem("CompletedDays@habits", JSON.stringify(nlwSetup.data))
}

Agora veja o mesmo código, só que refatorado

const saveDay = () => localStorage.setItem("CompletedDays@habits", JSON.stringify(nlwSetup.data))