Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Aula 3 - Dúvida sobre função.

Referente ao curso Lógica de Programação II: Funções, Desenhos e um Jogo

por Lucas Monteiro Lucchesi
| 46.8k xp | 20 posts

Prezados,

Por que no código abaixo, não usamos () quando nos referimos à função "atira", no trecho final do código?

<meta charset = "UTF-8">
<canvas id="tela" width="600" height="400"></canvas>

<script>

    var tela = document.getElementById("tela");
    var c = tela.getContext("2d");

    c.fillStyle = "gray";
    c.fillRect(0, 0, 600, 400);

    var atira = function(evento){

        var x = evento.pageX - tela.offsetLeft;
        var y = evento.pageY - tela.offsetTop;

        c.fillStyle = "blue";
        c.beginPath();
        c.arc(x, y, 10, 0, 2*Math.PI);
        c.fill();

        console.log("X: " + x + "\nY: " + y);
    }

    tela.onclick = atira;

</script>

Até então, todas as funções, quando chamadas no código, seguiam os padrões a seguir: atira () ou atira(argumentos)

2 respostas
solução!
por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Você vai entender com um exemplo de escopo menor:

Tenho a seguinte função declarada em uma variável:

var alerta = function() {
    alert('Olá');
};

Como você faz para executar essa função? Você faz assim:

alerta();

Declare essa função aí em um arquivo HTML qualquer. Depois, abra a página no Chrome, abra o console e no console escreva:

alerta()

Isso vai exibir seu alerta, mas o que acontece se você escrever no console e der ENTER logo depois:

alerta

Será impresso no console o corpo da função, ou seja, sua definição.

Quando você faz:

 tela.onclick = atira;

você quer pegar sua função atira (sua definição, seu corpo) e jogar para dentro de tela.onclick. Agora o tela.onclick guarda sua função que foi atribuída a ele.

Quando você clica nos botões, o navegador, sem você ver faz: tela.onclick(). Veja que ele usou os parânteses, e como lá dentro do onclick tem o corpo da função, ele executa a função.

Agora, se você tivesse feito isso:

 tela.onclick = atira();

Não vai funcionar. Você esta executando a função atira porque usou (), ou seja, essa função foi chamada antes, indevidamente, que só pode ser chamada quando alguém clicar. Segundo, a função atira não retorna valor algum e tela.onclick receberá undefined como valor.

Daí, tudo vai pro brejo. Quando alguém clicar nosso tela.onclick terá como valor undefined e não fará nada.

Consegui ajudar?

por Lucas Monteiro Lucchesi
| 46.8k xp | 20 posts

Muito obrigado, Flavio! Ajudou muito.