if e else (calculadora simples) em JavaScript. Dica 12

Nesta dica nós fazemos uma calculadora simples e quando falo simples quero dizer que, os valores e o tipo de conta são informados no código fonte.

Podemos usar if e else sem usar uma função, mas escolhi este exemplo para explicar if e else.

A seguir temos o código fonte HTML para iniciarmos essa dica. Salve-o com o nome que quiser no editor ou IDE de sua preferência como uma extensão .html.

<!DOCTYPE html>
<html>
    <head>
        <title>if e else em JavaScript (calculadora simples)</title>
        <meta charset="UTF-8">
    </head>
    <body>
        <h1>if e else em JavaScript (calculadora simples)</h1>
        <script src="ifelse.js"></script>
    </body>
</html>

A seguir crie um documento chamado ifelse.js e as dicas a seguir são para serem escritas nele.

Em dicas anteriores já foi explicado o que é uma função, então, a primeira informação que iremos inserir em nosso .js é uma função.

function calculadora (q,w,conta) {}

Condicional if

Para a Fundação Mozilla a condicional if é uma estrutura condicional que executa a afirmação, dentro do bloco, se determinada condição for verdadeira. Se for falsa, executa as afirmações dentro de else.

if (condição verdadeira) { } else {instrução}

Considere sempre que, o if é verdade.

if (conta === "+") {
return q + w;
}

Nós teremos 4 "verdades" em nossa calculadora, por isso, utilizaremos else if.

else if(conta === "-") {
        return q - w;
    }else if (conta === "*") {
        return q * w;
    }else if (conta === "/") {
        return q / w;
    }

E se o valor da nossa variável conta não for nenhum dos valores informados teremos um erro, então, precisamos tratar esse possível erro utilizando apenas else.

else{
document.write("<h1>Não foi possível calcular.</h1>");
}

Agora criamos mais um document.write para chamar a nossa função calculadora.

document.write("<h1>"+q+" "+conta+" "+w+" = "+calculadora(q,w,conta)+"</h1>")

Esse document.write parece estranho?

Fiz isso nele apenas para ele ficar mais bonito. Mas ainda não informamos os valores das variáveis.

var q = 10;
var w = 5;
var conta = "/";

Essa dica é isso, confira o vídeo.

Assista ao vídeo:

Código fonte JavaScript (completo)

Dica

Brinque com os valores das variáveis, com os nomes das variáveis, ao invés de document.write utilize um alert. Espero que essa dica tenha sido útil e, até a próxima.

Espero que esta dica tenha sido útil.

Link externo da Fundação Mozilla sobre if e else.

Se estiver utilizando bloqueador de propaganda, por favor, coloque este site na lista branca (isto sempre será apenas um pedido). Obrigado pela escolha.