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.
<textarea></textarea> --> define un control de entrada de texto de varias líneas.
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.
< --> el operador menor que ( < ) devuelve true si el operando izquierdo es menor que el operando derecho.
if --> se usa para especificar un bloque de código que se ejecutará, si una condición especificada es verdadera.
.push() --> agrega uno o más elementos al final de un array y devuelve la nueva longitud del array.
% --> el operador de modulo ( % ) devuelve el resto de la división.
== --> el operador de comparacion ( == ) comprueba si sus dos operandos son iguales y devuelve un resultado booleano.
++ --> el operador de incremento ( ++ ) incrementa (suma uno a) su operando y devuelve un valor.
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 solicita un número N al usuario y muestra los primeros N números pares de la serie de números naturales comenzando desde el 0.
1. Declaración del documento HTML
<!DOCTYPE html>
Indica que el documento utiliza la versión HTML5.
2. Etiqueta HTML
<html lang="es">
Contiene toda la página web e indica que el idioma del documento es español.
3. Sección HEAD
<meta charset="UTF-8">
Permite utilizar caracteres especiales como la letra ñ y las tildes.
<meta name="viewport">
Hace que la página se adapte correctamente a teléfonos, tabletas y computadoras.
<title>
Define el nombre que aparece en la pestaña del navegador.
4. Encabezado
<h3>
Muestra el título del ejercicio en la página.
5. Formulario
<form>
Agrupa todos los controles que utiliza el usuario.
6. Etiqueta y caja de texto
<label>
Muestra el texto "Número:" para indicar qué dato debe ingresar el usuario.
<input type="number" id="numero">
Permite escribir únicamente números.
7. Botones
<input type="button">
Ejecuta la función mostrar() cuando el usuario hace clic en el botón Mostrar.
<input type="reset">
Limpia todos los datos del formulario.
8. Área de resultados
<textarea>
Muestra la lista de números pares encontrados.
9. Función mostrar()
function mostrar()
Es la función que realiza todo el proceso para encontrar los primeros números pares.
10. Leer el número ingresado
let n = parseInt(document.getElementById('numero').value);
Obtiene el número escrito por el usuario y lo convierte a un número entero.
11. Declaración de variables
let t = [], i = 0, c = 0;
- t: almacena los números pares encontrados.
- i: representa el número que se está evaluando.
- c: cuenta cuántos números pares se han encontrado.
12. Ciclo while
while(c < n)
El ciclo continúa ejecutándose mientras todavía no se hayan encontrado los N números pares.
13. Verificar si el número es par
if(i % 2 == 0)
El operador % obtiene el residuo de una división.
Si el residuo de dividir entre 2 es igual a 0, significa que el número es par.
14. Guardar el número par
t.push(i);
Agrega el número par al arreglo.
c++;
Aumenta el contador de números pares encontrados.
15. Pasar al siguiente número
i++;
Incrementa el número que será evaluado en la siguiente repetición.
16. Mostrar el resultado
document.getElementById('resultado').value = t;
Muestra todos los números pares almacenados en el arreglo dentro del área de texto.
Ejemplo de funcionamiento
Entrada: 5
Proceso:
0 es par ✔
1 no es par ✘
2 es par ✔
3 no es par ✘
4 es par ✔
5 no es par ✘
6 es par ✔
7 no es par ✘
8 es par ✔
Resultado:
0, 2, 4, 6, 8
Resumen
El programa solicita un número N, recorre los números naturales desde 0 utilizando un ciclo while, verifica cuáles son pares mediante el operador %, los guarda en un arreglo y finalmente los muestra en el textarea.
No hay comentarios.:
Publicar un comentario