Calculadora em JavaScript: Lógica e Interface com Visual Studio Code

Uma calculadora simples pode ser criada utilizando JavaScript para a lógica e o Visual Studio Code para a interface. Vamos ver como isso pode ser feito:

Lógica da Calculadora em JavaScript

Primeiro, vamos criar as funções que serão responsáveis pelas operações matemáticas da calculadora. Vamos criar as funções add, subtract, multiply e divide.

    
      function add(a, b) {
        return a + b;
      }

      function subtract(a, b) {
        return a - b;
      }

      function multiply(a, b) {
        return a * b;
      }

      function divide(a, b) {
        if (b === 0) {
          return "Error: Divisão por zero!";
        }
        return a / b;
      }
    
  

Interface da Calculadora com Visual Studio Code

Agora vamos criar a interface da calculadora utilizando HTML e CSS no Visual Studio Code. Vamos criar os campos de entrada para os números e os botões para as operações.

    
      <input type="text" id="num1" placeholder="Número 1">
      <input type="text" id="num2" placeholder="Número 2">
      <button onclick="addNumbers()">Somar</button>
      <button onclick="subtractNumbers()">Subtrair</button>
      <button onclick="multiplyNumbers()">Multiplicar</button>
      <button onclick="divideNumbers()">Dividir</button>
      <div id="result"></div>
    
  

Script em JavaScript para Interagir com a Interface

Por fim, vamos criar o script em JavaScript que irá interagir com a interface da calculadora. Vamos capturar os valores dos campos de entrada, realizar as operações matemáticas e exibir o resultado.

    
      function addNumbers() {
        let num1 = parseFloat(document.getElementById("num1").value);
        let num2 = parseFloat(document.getElementById("num2").value);
        document.getElementById("result").innerHTML = add(num1, num2);
      }

      function subtractNumbers() {
        let num1 = parseFloat(document.getElementById("num1").value);
        let num2 = parseFloat(document.getElementById("num2").value);
        document.getElementById("result").innerHTML = subtract(num1, num2);
      }

      function multiplyNumbers() {
        let num1 = parseFloat(document.getElementById("num1").value);
        let num2 = parseFloat(document.getElementById("num2").value);
        document.getElementById("result").innerHTML = multiply(num1, num2);
      }

      function divideNumbers() {
        let num1 = parseFloat(document.getElementById("num1").value);
        let num2 = parseFloat(document.getElementById("num2").value);
        document.getElementById("result").innerHTML = divide(num1, num2);
      }