No curso do framework electron vi que por várias vezes o professor abre a função assim (xxxxxx, function() {}) e em outras vezes usa arrow functions (=>). Como vou saber quando usar uma ou outra??
No curso do framework electron vi que por várias vezes o professor abre a função assim (xxxxxx, function() {}) e em outras vezes usa arrow functions (=>). Como vou saber quando usar uma ou outra??
Fala ai Sttefani, tudo bem? Isso vai muito de gosto e necessidade.
Normalmente eu recomendo fazer o uso de arrow functions, que é da segunda maneira:
const minhaFuncao = () => {}
Mas, em alguns casos pode ser que seja necessário o uso de funções de declaração, que é a primeira maneira:
function minhaFuncao() {}
A básica diferença entre as duas está relacionado ao contexto de função.
Funções de declaração executadas pelo browser possuí o elemento que a disparou como contexto. imagine que você clicou em um botão e chamou alguma função:
const botao = document.querySelector('#meuBotao')
botao.addEventListener('click', function() {
console.log(this)
})
Nesse caso, o this
será o próprio elemento button
.
Com arrow functions poderíamos pegar o button
através do event.target
:
const botao = document.querySelector('#meuBotao')
botao.addEventListener('click', event => {
console.log(event.target)
})
Essa é uma das mais simples diferença entre elas (claro que existe mais).
Resumindo: Eu recomendo o uso de arrow functions sempre que possível.
Espero ter ajudado.