Actividad
Cada estudiante deberá crear un pequeño juego llamado “Adivina el número”.
El juego consistirá en que el usuario escriba un número y el programa le indique si acertó o no al número secreto.
Explicación de lo que debe hacer el juego
El programa debe tener:
- Un título visible.
- Una caja donde el usuario escriba un número.
- Un botón para verificar la respuesta.
- Un mensaje que indique el resultado.
Cuando el usuario presione el botón:
- Si el número es correcto, debe aparecer un mensaje de felicitación.
- Si el número es incorrecto, el programa debe pedir que vuelva a intentarlo.
Requisitos del trabajo
El estudiante debe utilizar:
- Etiquetas básicas de HTML.
- JavaScript para crear la lógica del juego.
- Eventos mediante un botón.
- Mensajes interactivos.
Código guía
<!DOCTYPE html>
<html>
<head>
<title>Juego en JavaScript</title>
</head>
<body>
<h1>Adivina el Número</h1>
<p>Escribe un número del 1 al 10.</p>
<input type="number" id="dato">
<button onclick="comprobar()">
Verificar
</button>
<script>
// Número secreto del juego
let numeroSecreto = 7;
// Función que revisa la respuesta
function comprobar(){
// Guarda el número escrito por el usuario
let numero = document.getElementById("dato").value;
// Compara el número del usuario con el número secreto
if(numero == numeroSecreto){
alert("¡Correcto! Ganaste el juego");
}else{
alert("Número incorrecto. Intenta nuevamente");
}
}
</script>
</body>
</html>Explicación del código
1. Título del juego
<h1>Adivina el Número</h1>Muestra el nombre del juego en la página.
2. Caja de texto
<input type="number" id="dato">Permite que el usuario escriba un número.
El atributo id sirve para identificar el elemento desde JavaScript.
3. Botón
<button onclick="comprobar()">Cuando el usuario hace clic, se ejecuta la función llamada comprobar().
4. Variable
let numeroSecreto = 7;Guarda el número correcto del juego.
5. Función
function comprobar()La función contiene las instrucciones que se ejecutan cuando el usuario presiona el botón.
6. Condición
if(numero == numeroSecreto)Compara el número ingresado con el número secreto.
Si ambos son iguales, el usuario gana.
Actividad adicional
Agregar al juego:
- Un color de fondo.
- Un mensaje personalizado.
- Otro botón para reiniciar el juego.
- Un contador de intentos (opcional).
Forma de entrega
- Presentar el archivo funcionando en clase.
- Guardar el trabajo con el nombre y curso del estudiante.
- Explicar de manera básica cómo funciona el programa.
Criterios de evaluación
| Aspecto | Valor |
|---|---|
| Funcionamiento del juego | 40% |
| Uso correcto de JavaScript | 30% |
| Orden y presentación | 20% |
| Explicación del estudiante | 10% |
Observación
El estudiante debe comprender el funcionamiento del código presentado. Durante la sustentación se podrán realizar preguntas relacionadas con las instrucciones utilizadas en el programa.