Por que o instrutor instanciou duas consts idênticas?
const cancelFormTaskBtn = document.querySelector('.appform-footerbutton--cancel')
const btnCancelar = document.querySelector('.appform-footerbutton--cancel')
Ele também apenas utiliza uma
Solucionado
Por que o instrutor instanciou duas consts idênticas?
const cancelFormTaskBtn = document.querySelector('.appform-footerbutton--cancel')
const btnCancelar = document.querySelector('.appform-footerbutton--cancel')
Ele também apenas utiliza uma
Oi Gustavo! Tudo ok contigo?
Acredito que você já deve ter visto, mas a explicação para isso está nessa aula, onde podemos ver que o instrutor cria essas constantes e depois atribui a elas o mesmo botão, e depois ele cria uma ouvinte de eventos do tipo clique e adiciona a classe "hidden" ao conteúdo da formTask. Mas na segunda constante ele atribui um ouvinte de eventos igual, mas com o propósito de ativar a função de limpeza do formulário.
Uma constante pode receber mais de um ouvinte de eventos em JavaScript, é possível adicionar vários ouvintes de eventos a um mesmo elemento. No entanto, aqui, ambas as funções associadas aos eventos click do botão fazem coisas diferentes (formTask.classList.add('hidden') e limparForm()). Isso pode levar a comportamentos inesperados se o botão for clicado. Mas depende do caso.
Quanto aos motivos para o desenvolvedor ter feito isso, podem haver várias razões:
Boas práticas de programação: Um dos maiores motivos dessa separação de funções é o intuito de seguir essa boa prática de programação. Usar uma função para fazer duas coisas diferentes não é muito legal, pode parecer redundante, mas fazendo essa separação fica mais fácil de entender o que cada parte faz. Cada parte têm uma "função" diferente e por isso merecem ser tratadas com eventos separados.
Manutenção do código: O desenvolvedor pode ter planejado adicionar mais funcionalidades a cada botão no futuro, e ter separado as constantes para facilitar a manutenção.
Clareza do código: Em alguns casos, pode ser mais claro explicitar diferentes comportamentos associados a diferentes variáveis, mesmo que esses comportamentos estejam relacionados a um mesmo elemento.
Refatoração futura: O código pode ter passado por mudanças ao longo do tempo, e as constantes podem ter sido introduzidas para preparar o terreno para futuras refatorações ou adições de funcionalidades.
Mas era isso. Se precisar de explicações adicionais é só falar.
Se quiser dar uma olhada nesse outro tópico sobre o mesmo assunto, fique à vontade.
Espero ter ajudado.
Abraços e bons estudos.