Script: Conversão de Celsius para Fahrenheit e Vice-versa

Neste tutorial, vamos resolver um exercício de funções, fazendo um script que faz a conversão entre as temperaturas Celsius e Fahrenheit.


Converter entre Celsius e Fahrenheit

As fórmulas para transformar, são:
Conversão de Fahrenheit para Celsius

Nosso script vai ter a seguinte 'cara':
Curso de JavaScript online grátis para download

Ou seja, primeiro selecionamos que tipo de conversão desejamos fazer.
Depois, inserimos o valor a ser convertido.

Após clicar no botão resposta, o valor convertido aparece logo abaixo.

Script de Conversão de temperatura

No HTML, usamos dois radio buttons para que o usuário possa selecionar apenas uma das opções.

A id do primeiro é "CtoF", ou seja, Celsius para Fahrenheit. O usuário vai fornecer a temperatura em Celsius e ela exibirá em Fahrenheit.

A segunda id é "FtoC", ou seja, de Fahrenheit para Celsius.

Temos uma campo de input de id "number", um botão e uma div onde vai a resposta.

Nosso código HTML fica:

<!DOCTYPE html>
<html>
 <head>
    <title>Apostila JavaScript Progressivo</title>
    <script type="text/javascript" src="script.js"></script>
 </head>
 <body>
  <input type="radio" name="converter" id="CtoF"/>Celsius para Fahrenheit <br />
    <input type="radio" name="converter" id="FtoC"/>Fahrenheit para Celsius <br />
    Converter valor :<input id="num" type="number"> <br />
  <button onclick="main()">Calcular</button><br />
  Resposta: <div id="resposta" style='display:inline'></div><br />
</html>



Quando clicamos no botão calcular, ele chama a função main().
Essa função vai checar qual radiobutton foi selecionado (.checked) e chamar a função correta.

Se foi o "CtoF", chama a função ctof.
Se foi o "FtoC", chama a função ftoc.

Em ambas funções, ela recebem um número como parâmetro, é o valor que o usuário digitou no campo de input.

Dentro de cada função colocamos direto a fórmula de conversão e damos return nessa resposta.
Colocamos essa resposta no HTML via innerHTML.

Veja como ficou o código JavaScript:


function main()
{
 var num = parseInt(document.getElementById("num").value);
 var resp = document.getElementById("resposta");
 
 if(document.getElementById("CtoF").checked==true)
  resp.innerHTML = ctof(num);
 if(document.getElementById("FtoC").checked==true)
  resp.innerHTML = ftoc(num);
}
function ctof(x)
{
 return (1.8*x + 32);
}

function ftoc(x)
{

 return ( (x-32)*5/9 );
}

Resultado do script:


Celsius para Fahrenheit
Fahrenheit para Celsius
Converter valor :

Resposta:

Nenhum comentário:

Postar um comentário