[Dúvida] Não entendi a presença de duas constantes com o mesmo valor.

Oi Christopher, tudo bem?

Entendo sua dúvida, pode parecer um pouco confuso a princípio. A razão pela qual o professor usa duas constantes diferentes (cancelFormTaskBtn e btnCancelar) com o mesmo valor é para adicionar eventos de clique distintos a cada uma.

No caso, cancelFormTaskBtn é usada para adicionar um evento que apenas esconde o formulário, enquanto btnCancelar é usada para adicionar um evento que limpa o formulário e, em seguida, o esconde.

Embora as duas constantes tenham o mesmo valor, elas representam eventos diferentes e, por isso, são tratadas separadamente.

Aqui está um exemplo prático para entender melhor:

cancelFormTaskBtn.addEventListener('click', () => {
    // Esconde o formulário
    formTask.classList.add('hidden')
})

btnCancelar.addEventListener('click', limparForm)
// limparForm é uma função que limpa o formulário e depois o esconde.

Neste exemplo, o evento associado a cancelFormTaskBtn apenas esconde o formulário. Já o evento associado a btnCancelar limpa o formulário e depois o esconde. Embora as ações pareçam similares, elas têm comportamentos ligeiramente diferentes e, por isso, são tratadas como eventos separados.

Espero ter ajudado.

Um abraço e bons estudos.

Nesse caso não poderia colocar os dois eventos juntos no mesmo clique?

cancelFormTaskBtn.addEventListener('click', () => {
    formTask.classList.toggle('hidden');
    limparForm();
})

Ou isso traria algum problema?

Ou até remover o toggle/add, já que ele é executado também na função limparForm()?

Não é boa prática fazer isso galera, botar uma função pra fazer duas coisas diferentes. Pode parecer redundante, mas é assim mesmo na programação.

As funções tem "funções" diferentes e por isso são tratadas com eventos separados. ;)