5
respostas

Porque ao click do botão, minha função não é invocada novamente ?

Olá pessoal, consegui finalizar o desafio da aula 2 mas com uma duvida ainda, por que ao clicar do botão, a minha função nao é invocada novamente ? A unica função aonde isso ocorre é na primeira do Ola mundo, as outras executam assim que eu acesso minha pagina web porem não ao clicar em seus respectivos botões.

function olaMundo()
{
    console.log("Ola Mundo");
}

function exibirNome(nome)
{
    console.log(`Ola ${nome}`);

}
exibirNome("Guilherme");

function dobroNumero(num)
{
    return num*2

}
let resultado = dobroNumero(10);
console.log(`O resultado é ${resultado}`);

function mediaNumero(num1,num2,num3)
{
    return (num1+num2+num3)/3
}
let media = mediaNumero(8,5,8);
console.log(`A media das notas é ${media}`);

function maiorNum(a,b)
{
    if (a>b)
    {
        return a;
    }
    else
    {
        return b;
    }
}   
let maior = maiorNum(8,15);
console.log(`O maior numero é ${maior}`);

function multiNum(numeroX)
{
    return (numeroX*numeroX);
}
let resultadoX = multiNum(15);
console.log(`O resultado da multiplicação é ${resultadoX}`);
5 respostas

Olá Guilherme, eu verifiquei que seu código está funcionando e exibindo no console.log o que foi solicitado. E ao apertar o botão de refresh da página ela continua retornando os valores que você definiu. Neste caso, a qual botão você está se referindo ao dizer que ele não invoca a função novamente, poderia explciar melhor? Observe que nesses exercícios as funções são invocadas em tempo de execução, ou seja, quando você executa o código no navegador. O que faz que não seja necessário apertar nenhum botão para invocar as funções.

Foto de Vagner Gueiros Ramos   Caso este post tenha ajudado, por favor, ☑️ Marcar como solução. Bons Estudos!

Perdão Wagner, coloquei pela metade.

O index.html tem alguns botões, e o primeiro como falei funciona tranquilamente, ja os demais não.

<header>
    <h1></h1>
</header>
<div class="container">
    <button onclick="olaMundo()" class="button">Console</button>
    <button onclick="exibirNome()" class="button">Nome</button>
    <button onclick="dobroNumero()" class="button">Numero</button>
    <button onclick="mediaNumero()" class="button">Media</button>
    <button onclick="maiorNum()" class="button">Maior</button>
    <button onclick="multiNum()" class="button">Multi</button>
</div>

  <script src="app.js"></script>

Comparando outros codigos parece estar certo, mas ainda não funcionam

No meu caso não percebo o motivo que depois de limpar o console e apertar o botão para exibir o nome, ele retorna com "Olá, undefined", não reconhecendo o nome.

Guilherme , Ao analisar seu código com o HTML eu pude notar um detalhe, as funções nestes casos precisam de parâmetros para executarem e apresentar o resultado que deseja. Portanto, com a lógica que você implementou, ao executar a primeira vez as funções usam os parâmetros fornecidos diretamente dentro do próprio método no arquivo app.js como no exemplo, onde ela irá usar o parâmetro fornecido "Guilherme":

function exibirNome(nome)
{
    console.log(`Ola ${nome}`);
}
exibirNome("Guilherme");

Mas, ao clicar no botão da pagina, a função evocada através do HTML está sem parâmetro definido, por isso ela retorna como undefined ou não executa conforme o esperado:

<!-- função exibirNome() que é evocada sem paramento -->
<button onclick="exibirNome()" class="button">Nome</button>

Entendo que é preciso criar uma lógica para passar esses parâmetros para a função quando você evocar ela novamente. Entendo que este assunto será aprofundado no decorrer do curso mas, por hora, suas funções atendem ao desafio que foi proposto.

Foto de Vagner Gueiros Ramos   Caso este post tenha ajudado, por favor, ☑️ Marcar como solução. Bons Estudos!

Wesley olá, Seria importante analisar seu código para entender melhor a questão. Mas acredito que o seu caso seja o mesmo do exemplo acima referente a passagem de parâmetros para as funções. Bons estudos.