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

Dúvida no Ex. 4 da Aula 6 - Arrays: trabalhe com muitos dados

Fazendo testes, encontrei um problema e não conseguir compreender. Resolvi colocar botão.onclick para ser uma função.

var clickBotao = function(idBotao,efeito){
    var x = document.getElementById(idBotao);
    x.onclick = efeito;

clickBotao("verificar",adicionarSorteado);

A função compilou sem problema, mas quando testei modificar a função adicionarSorteio, não conseguir visualizar o erro o código é esse:

<strong> <meta charset="UTF-8"> </strong>

<input type="text" id="numero" />
<input type="submit" value="Adicione e verifique no Bingo!" id="verificar"/>

<script>
var adicionarSorteado = function(id,variavel){
    var numero2 = document.getElementById(id).value;
        for (var i = 0; i < variavel.length; i++){
            if (variavel[i] == numero2){
                alert("Numero ja sorteado!");
                return;
            }
        }
    variavel.push(numero2);
    console.log(variavel);
    };

var clickBotao = function(idBotao,efeito){
    var x = document.getElementById(idBotao);
    x.onclick = efeito;
};

var sorteados = [];
clickBotao("verificar",adicionarSorteado("numero",sorteados));

</script>

Minha maior duvida é o porque da função clickBotao da certo e o adicionarSorteado não da certo.

Alguém consegue ver o(s) erro(s) e informar a maneira certa para que a função adicionarSorteio pudesse ser aplicada para outra variável e não somente a variável sorteados ?

obs.: Ao compilar o console já mostra o valor da variavel sorteados sendo [""] e não adicionar valores.

3 respostas

Olá! Tenta o seguinte...

No lugar de:

clickBotao("verificar",adicionarSorteado("numero",sorteados));

Escreva:

clickBotao("verificar", function(){
    adicionarSorteado("numero", sorteados);
});

Julianny Moreira, obrigado, deu certo. Mas, se a var adicionarSorteado já tinha sido atribuída como function, achei muito estranho colocar o function() lá mais uma vez. Fiquei mais confuso ainda, mas funcionou, ta valendo.

solução!

Oi Kakhan, a sugestão da Julianny foi bem legal, só vou adicionar aqui o porquê de funcionar, ok? :-)

O que acontece é que, quando configuramos o onclick do botão, passamos a referência da função que ele vai executar quando apertar o botão.

E é aqui que está a questão: não queremos chamar a função na hora que estamos configurando o botão. Mas quando usamos nomeDaFuncao(parametros) estamos chamando a função para esses parâmetros, nesse momento.

Então, na prática, quando você colocou:

clickBotao("verificar",adicionarSorteado("numero",sorteados));

Isso executou a função adicionarSorteado("numero", sorteados) pegou o resultado da função (que é undefined porque a função não dá return nada) e, só depois, chamou o clickBotao("verificar", undefined);

Como queremos que o botão chame a função apenas quando ele for clicado, ainda não podemos passar parâmetros -- ou sequer usar os parênteses na função, já que eles indicam que a função deve ser executada alí mesmo.

Uma regrinha pra ajudar: como é o botão que chama a função, ela não pode receber parâmetros!

A resposta da Julliany funciona, portanto, porque aí vocês estão passando uma função (criada alí mesmo) que não recebe parâmetros e só quando ela for chamada é que ela roda o código interno: o que chama a adicionarSorteado com os parâmetros certos.

Fez sentido? Se sim, por favor, marque uma das respostas aqui como solução para o problema, assim outros alunos passando pela mesma situação podem se beneficiar da solução também! :-)