Código del ejercicio:
Definición de los códigos del ejercicio:
<h3></h3> --> representa un encabezado de nivel 3.<form></form> --> se utiliza para crear un formulario HTML para la entrada del usuario.
<br> --> produce un salto de línea en el texto.
<label></label> --> representa una etiqueta para un elemento en una interfaz de usuario.
<input> --> etiqueta especifica un campo de entrada donde el usuario puede ingresar datos.
onclick --> onclick evento ocurre cuando el usuario hace clic en un elemento.
<script></script> --> contiene comandos u ordenes que se van ejecutando de manera secuencial y comúnmente se utilizan para controlar el comportamiento de un programa en específico o para interactuar con el sistema operativo.
function --> es un bloque de código diseñado para realizar una tarea en particular.
let --> permite declarar variables limitando su alcance (scope) al bloque, declaración, o expresión donde se está usando.
parseInt() --> analiza un valor como una cadena y devuelve el primer entero.
while --> el ciclo while recorre un bloque de código siempre que una condición específica sea verdadera.
if --> se usa para especificar un bloque de código que se ejecutará, si una condición especificada es verdadera.
else if --> se usa para especificar una nueva condición para probar, si la primera condición es falsa.
else --> se usa para especificar un bloque de código a ejecutar, si la misma condición es falsa.
>= --> el operador mayor que o igual ( >= ) devuelve true si el operando izquierdo es mayor o igual que el operando derecho, y en false caso contrario.
+= --> el operador de asignación de suma ( += ) suma el valor del operando derecho a una variable y asigna el resultado a la variable.
/= --> el operador de asignación de división ( /= ) divide el valor del operando derecho de una variable y asigna el resultado a la variable.
== --> el operador de comparacion ( == ) comprueba si sus dos operandos son iguales y devuelve un resultado booleano.
document.getElementById() --> devuelve un elemento con un valor especificado.
.value --> establece o devuelve el valor del atributo de valor de un campo de texto.
Explicación del Código:
Este programa permite ingresar un número entero de hasta 2 dígitos. Luego cuenta cuántos dígitos tiene el número y muestra uno de los siguientes mensajes:
- Si tiene 1 dígito, muestra: "Tiene 1 dígito".
- Si tiene 2 dígitos, muestra: "Tiene 2 dígitos".
- Si tiene más de 2 dígitos, muestra un mensaje indicando que el número es demasiado grande.
1. Estructura HTML
Título del ejercicio
<h3>
Ingresar un número máximo de 2 dígitos...
</h3>Muestra las instrucciones para que el usuario sepa qué debe hacer.
Campo para ingresar el número
<input type="number" id="numero">Permite escribir únicamente números. El identificador id="numero" sirve para que JavaScript pueda obtener el valor ingresado.
Botón Mostrar
<input type="button"
value="Mostrar"
onclick="mostrar()">Cuando el usuario hace clic en este botón, se ejecuta la función mostrar().
Botón Limpiar
<input type="reset" value="Limpiar">Borra el contenido del formulario y deja los campos vacíos.
Campo Resultado
<input type="text"
id="resultado"
size="40">Aquí aparece el mensaje indicando cuántos dígitos tiene el número.
2. Función mostrar()
Declaración de la función
function mostrar(){Se crea una función llamada mostrar() que se ejecuta al presionar el botón.
Leer el número
let n = parseInt(document.getElementById('numero').value);Esta línea realiza tres tareas:
- Obtiene el contenido del cuadro de texto.
- Convierte ese contenido a un número entero usando parseInt().
- Guarda el número en la variable n.
Variable contador
let c = 0;Se crea una variable llamada c que servirá para contar la cantidad de dígitos. Comienza en cero porque todavía no se ha contado ningún dígito.
Ciclo while
while(n >= 1){
c += 1;
n /= 10;
}Este ciclo cuenta los dígitos del número.
Su funcionamiento es el siguiente:
- Mientras el número sea mayor o igual a 1, el ciclo continúa.
- En cada vuelta aumenta el contador en 1.
- Después divide el número entre 10 para eliminar un dígito.
- Cuando el número es menor que 1, el ciclo termina.
Ejemplo:
n = 58
Primera vuelta:
58 / 10 = 5.8
c = 1
Segunda vuelta:
5.8 / 10 = 0.58
c = 2
Como 0.58 ya no es mayor o igual a 1,
el ciclo termina.
Resultado: el número tiene 2 dígitos.
Si tiene un dígito
if(c == 1){
document.getElementById('resultado').value =
"Tiene 1 dígito";
}Si el contador vale 1, significa que el número tiene un solo dígito y muestra ese mensaje.
Si tiene dos dígitos
else if(c == 2){
document.getElementById('resultado').value =
"Tiene 2 dígitos";
}Si el contador vale 2, significa que el número tiene dos dígitos y muestra el mensaje correspondiente.
Si tiene más de dos dígitos
else{
document.getElementById('resultado').value =
"Por favor ingresar número máximo de 2 dígitos";
}Si el contador es mayor que 2, significa que el usuario ingresó un número demasiado grande y se muestra un mensaje de advertencia.
3. Resumen del funcionamiento
El programa realiza los siguientes pasos:
- El usuario escribe un número.
- Al presionar Mostrar, se ejecuta la función mostrar().
- El programa obtiene el número ingresado.
- Utiliza un ciclo while para contar los dígitos.
- Según la cantidad de dígitos, muestra el mensaje correspondiente.
- Si el número tiene más de dos dígitos, informa que solo se permiten números de hasta dos dígitos.
No hay comentarios.:
Publicar un comentario