Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Dúvida no Ex. 3 da Aula 6 - Eventos

Olá pessoal!

Neste exercício, o gabarito é:

function calculaTodosImcs(){
    //lógica do calcula.
}

var botao = document.getElementById("calcular-imc");
botao.onclick = calculaTodosImcs;

No envento onclick, o browser se encarrega de chamar a função, correto? É por este motivo que não a chamo com os parênteses: calculaTodosImcs();

No texto da explicação referente ao capítulo, a função está sendo chamada com os parênteses. Testei das duas formas e quando coloco com os parênteses, o cálculo é realizado sempre que a página é carregada, sem o botão ter sido clicado.

Se alguém puder explicar o quê ocorreu "por baixo dos panos" nessas duas situações com o browser.

Obrigado e abs!

2 respostas
solução!

Oi Bruno, tudo bem? (: Então, oq vc falou sobre a diferença da função sem parênteses e com parênteses está correto. Quando vc atribui a função para um listener, o navegador se encarregará de chamá-la toda vez que esse listener rodar, ou seja, nesse caso o botão for clicado.

Já experimentou fazer o seguinte teste:

botao.onclick = calculaTodosImcs();

Nesse caso a função seria executada ao carregar a página e o listener 'onclick' receberia o retorno da função.

Fiz uns testes aqui e quando o botao.onlick recebe uma função, oq sai no

console.log(botao.onclick);

é o nome da função, mas quando ele recebe o retorno de alguma função, por exemplo:

botao.onclick = funcao();

ele imprime null, independente se a função não retorna nada, um int ou uma string.

Por debaixo dos panos o browser tenta chamar a função do listener, se não for uma função, não faz nada (:

Abraços!

Eu estava com o mesmo problema e funcionou assim, mas no fim da aula ele passa como uma função anônima, e era como estava o meu e dessa forma ele executava quando a página carregava.