Cómo hacer un programa de calculadora en JavaScript

Si es nuevo en JavaScript o comienza con JavaScript, entonces es mejor comenzar implementando un programa de calculadora pequeño y fácil. En esta publicación, vamos a aprender a hacer una calculadora muy básica pero funcional usando JavaScript.

Para tomar entradas y mostrar la salida al usuario, vamos a usar el inmediato y el alerta Funciones del navegador respectivamente.

Hay dos formas principales de implementar la funcionalidad de una calculadora, primero es mediante el uso del if-else declaraciones, y la otra forma es usar el cambiar declaraciones que los cubriremos a los dos.

Paso 1: Configurar el entorno

Crear un nuevo archivo HTML, vincular un script.archivo js usando la etiqueta de script y ejecutar el archivo html para que se ejecute en el navegador, la etiqueta de script se ve así:

Y el archivo HTML contiene estas líneas:

Una calculadora simple

Paso 2: Escribir el código JavaScript

Lo primero que debemos hacer en nuestro código JavaScript es notificar al usuario que ingrese a un operador (*, -, +, /). Para hacer eso, creamos una nueva variable y solicitamos al usuario una nueva entrada que se colocará en esa variable:

const operatorVar = indere ("Ingrese el operador que desea usar (*, -, +, \)");

El siguiente paso es pedirle al usuario los operandos en los que funcionará este operador, lo hacemos utilizando las siguientes líneas de código:

const operand1 = indere ("Ingrese el primer valor");
const operand2 = indere ("Ingrese el segundo valor");

Necesitamos confirmar que el usuario no realizó ninguna entrada incorrecta con las siguientes líneas de código:

función isDigit (entrada)
var integer = true;
para (var char de entrada)
if (char '9')
entero = falso;


devolver entero;

if (isDigit (operand1) == falso)
alerta ("entrada incorrecta en Operand 1 | no es un valor entero");

if (isDigit (operand2) == falso)
alerta ("entrada incorrecta en Operand 2 | no es un valor entero");

A continuación, necesitamos verificar qué operador fue dado por el usuario utilizando el if-else declaraciones, realizar las operaciones requeridas y almacenar el resultado en una nueva variable:

if (operatorVar == "*")
resultado = operand1 * operand2;
else if (operatorVar == "-")
resultado = operand1 - operand2;
else if (operatorVar == "/")
resultado = operand1 / operand2;
else if (operatorVar == "+")
resultado = parseint (operand1) + parseInt (operand2);

Necesitamos verificar también un operador incorrecto, para eso simplemente usaremos el demás Declaración y alerta al usuario de que se realizó una entrada incorrecta:

demás
alerta ("operador inválido");

El último paso es mostrar el resultado variable para el usuario utilizando el alerta Cuadro de diálogo:

alerta ("El resultado es:" + resultado);

Ha terminado codificando la calculadora en JavaScript.

Paso 3: Prueba de la calculadora

Para probar la calculadora que acaba de codificar, simplemente ejecute el archivo HTML y escriba los cuadros de solicitud como aparecen como se muestra en el GIF a continuación:

Como puede ver, la prueba fue un éxito porque nuestra calculadora funciona perfectamente bien, el fragmento de código completo es como:

const operatorVar = indere ("Ingrese el operador que desea usar");
const operand1 = indere ("Ingrese el primer valor");
if (isDigit (operand1) == falso)
alerta ("entrada incorrecta en Operand 1 | no es un valor entero");

const operand2 = indere ("Ingrese el segundo valor");
if (isDigit (operand2) == falso)
alerta ("entrada incorrecta en Operand 2 | no es un valor entero");

resultado var;
if (operatorVar == "*")
resultado = operand1 * operand2;
else if (operatorVar == "-")
resultado = operand1 - operand2;
else if (operatorVar == "/")
resultado = operand1 / operand2;
else if (operatorVar == "+")
resultado = parseint (operand1) + parseInt (operand2);
demás
alerta ("operador inválido");

alerta ("El resultado es:" + resultado);
función isDigit (entrada)
var integer = true;
para (var char de entrada)
if (char '9')
entero = falso;


devolver entero;

Paso 4: Uso de Switch en lugar de IF-Else

Para usar Switch en lugar de IF-Else Simple Reemplace las declaraciones IF-Else con las siguientes líneas de código:

Switch (OperatorVar)
caso "*":
resultado = operand1 * operand2;
romper;
caso "/":
resultado = operand1 / operand2;
romper;
Caso "+":
resultado = parseint (operand1) + parseInt (operand2);
romper;
caso "-":
resultado = operand1 - operand2;
romper;
por defecto:
alerta ("Operador no válido!");
romper;

El fragmento de código completo es como:

const operatorVar = indere ("Ingrese el operador que desea usar");
const operand1 = indere ("Ingrese el primer valor");
if (isDigit (operand1) == falso)
alerta ("entrada incorrecta en Operand 1 | no es un valor entero");

const operand2 = indere ("Ingrese el segundo valor");
if (isDigit (operand2) == falso)
alerta ("entrada incorrecta en Operand 2 | no es un valor entero");

resultado var; switch (operatorVar)
caso "*":
resultado = operand1 * operand2;
romper;
caso "/":
resultado = operand1 / operand2;
romper;
Caso "+":
resultado = parseint (operand1) + parseInt (operand2);
romper;
caso "-":
resultado = operand1 - operand2;
romper;
por defecto:
alerta ("Operador no válido!");
romper;

alerta ("El resultado es:" + resultado);
función isDigit (entrada)
var integer = true;
para (var char de entrada)
if (char '9')
entero = falso;


devolver entero;

Todo lo que queda ahora es probar este código, echar un vistazo al GIF a continuación:

Eso es todo, ha codificado una calculadora simple usando JavaScript.

Conclusión

Aprender un nuevo idioma requiere que cree aplicaciones de la vida real; Cuando está comenzando con el aprendizaje de JavaScript, un programa de calculadora es realmente útil y una manera fácil de comprender JavaScript. Hoy, en esta publicación, aprendimos a crear un programa de calculadora muy básico usando JavaScript usando ambos if-else declaraciones y el declaraciones de cambio.