Existe alguma maneira de reduzir meu código realizando as seguintes operações?? | JavaScript: programando na linguagem da web

Solucionado (ver solução)

Solucionado
(ver solução)

3
respostas

Referente ao curso JavaScript: programando na linguagem da web

por Wellington Alves Siqueira Lira

| 46.9k xp | 11 posts

var corpo = document.getElementById('c-calculadora');

var valor1S = corpo.querySelector('.v1-soma'); var valor2S = corpo.querySelector('.v2-soma'); var resulDaSoma = corpo.querySelector('.r-soma');

var valor1Su = corpo.querySelector('.v1-sub'); var valor2Su = corpo.querySelector('.v2-sub'); resulDaSub = corpo.querySelector('.r-sub');

var valor1M = corpo.querySelector('.v1-mult'); var valor2M = corpo.querySelector('.v2-mult'); var resulDaMult = corpo.querySelector('.r-mult');

var v1Soma = valor1S.textContent; var v2Soma = valor2S.textContent;

var v1Sub = valor1Su.textContent; var v2Sub = valor2Su.textContent;

var v1Mult = valor1M.textContent; var v2Mult = valor2M.textContent;

var soma = parseInt(v1Soma) + parseInt(v2Soma); resulDaSoma.textContent = 'O resultado da soma é: '+ soma;

var subtraI = parseInt(v1Sub) - parseInt(v2Sub); resulDaSub.textContent = 'O resutaldo da sub é: '+subtraI;

var multP = parseInt(v1Mult) * parseInt(v2Mult); resulDaMult.textContent = 'o resultado da Multiplicação é: ' + multP;

3 respostas

por Laís Cavalcanti

| 2576.8k xp | 4815 posts

Instrutor

17/06/2020

Oi, Wellington, tudo bem?

Tem sim como deixar uma calculadora em Javascript mais enxuta. Fiz da seguinte forma:

Criei dois input para receber dois valores, no caso, nossa calculadora é limitada a receber dois valores. Mas para que possamos reduzir, criamos 4 botões diferentes com operações distintas, soma, subtração, multiplicação e divisão. Cada value recebe o operador do calculo a ser feito.

Passamos por evento onClick a função calc. Na função calc, chamei os valores recebidos dos inputs numUm e numDois, na constante resultado fazemos o cálculo recebendo o sinal escolhido pelo usuário, por fim, verificamos se são valores válidos e imprimos na tela.

  <body>
    <h1>Calculadora de 2 números</h1>
    <form id="form">
      <label
        >Digite o primeiro número
        <input id="numUm" name="" type="text" required=""
      /></label>
      <label
        >Digite o segundo número
        <input id="numDois" name="" type="text" required=""
      /></label>
      <p>
        <input type="button" value="+" onclick="calc(this)" />
        <input type="button" value="-" onclick="calc(this)" />
        <input type="button" value="*" onclick="calc(this)" />
        <input type="button" value="/" onclick="calc(this)" />
      </p>
    </form>
    <div id="container"></div>

    <script>
      function calc(x) {
        const operacao = x.value;

        const numUm = parseFloat(document.querySelector("#numUm").value);
        const numDois = parseFloat(document.querySelector("#numDois").value);
        const resultado = eval(numUm + operacao + numDois);

        if (!isNaN(resultado)) {
          document.querySelector("#container").innerHTML = resultado;
        }
      }
    </script>
  </body>

Caso tenha ficado alguma dúvida é só falar! Bons estudos!

por Wellington Alves Siqueira Lira

| 46.9k xp | 11 posts

17/06/2020

Muito obrigado! Fiquei com dúvida de como seria para somar vários números escolhidos pelo usuário.

const resultado = eval(numUm + operacao + numDois + numTrês + numQuatro...); ficaria grande demais os comandos! você faria o que para somar mais de um valor , por exemplo uns 15 valores.

solução!

por Laís Cavalcanti

| 2576.8k xp | 4815 posts

Instrutor

29/06/2020

Oi, Wellington!

Você pode pegar esses valores que o usuário digita nos inputs, coloca-los dentro de um array, extrair esses valores e depois fazer uma operação de soma ou qualquer outra atribuição.