SESIÓN 1: INTRODUCCIÓN A JAVASCRIPT
SESIÓN 1: INTRODUCCIÓN A JAVASCRIPT
Grado: 9°
Asignatura: Tecnología e Informática
Duración: 2 horas
Objetivo de la sesión
Comprender la estructura básica de un programa en JavaScript y escribir los primeros scripts utilizando un lenguaje sencillo.
Conceptos Claves
- JavaScript: lenguaje de programación utilizado para la web.
- Variables: permiten almacenar datos en un programa.
- Tipos de datos: números, cadenas de texto, booleanos.
- Comentarios: sirven para explicar el código sin que afecte su ejecución.
Explicación Teórica
1. Qué es JavaScript
JavaScript es un lenguaje de programación que se utiliza para dar interactividad a las páginas web. Aunque se usa en los navegadores, también permite realizar operaciones matemáticas, manipular datos y automatizar tareas.
2. Sintaxis Básica
ejercicio1
<!DOCTYPE HTML>
<html>
<body>
<p>Antes del <br>
script...</p>
<script>
alert( '¡Hola, mundo!' );
</script>
<p>...Después del script.</p>
</body>
</html>
ejercicio 2
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ingreso de Variables</title>
</head>
<body>
<h2>Ingresa tus datos</h2>
<label for="nombre">Nombre:</label>
<input type="text" id="nombre"><br><br>
<label for="edad">Edad:</label>
<input type="number" id="edad"><br><br>
<button onclick="mostrarDatos()">Enviar</button>
<p id="resultado"></p>
<script>
function mostrarDatos() {
let nombre = document.getElementById("nombre").value;
let edad = document.getElementById("edad").value;
document.getElementById("resultado").innerText = "Hola, " + nombre + "! Tienes " + edad + " años.";
}
</script>
</body>
</html>
Un programa en JavaScript está compuesto por instrucciones que el computador ejecuta en orden.
Ejemplo básico:
console.log("Hola, mundo!");
Este código muestra el mensaje "Hola, mundo!" en la consola.
3. Variables en JavaScript
Las variables almacenan datos y pueden declararse de la siguiente forma:
var nombre = "Juan"; // Variable con var (poco usada hoy en día)
let edad = 15; // Variable con let (recomendada)
const PI = 3.1416; // Variable constante
4. Tipos de Datos
JavaScript maneja distintos tipos de datos:
- Números: 10, 3.14, -5
- Cadenas de texto (Strings): "Hola", "JavaScript"
- Booleanos: true (verdadero) o false (falso)
Ejemplo:
let mensaje = "Aprendiendo JavaScript";
let numero = 20;
let esEstudiante = true;
5. Comentarios en el Código
Los comentarios permiten documentar el código y no se ejecutan.
// Esto es un comentario de una línea
/* Esto es un comentario de múltiples líneas */
Ejercicios Prácticos
Ejercicio 1: Escribiendo tu Primer Script
Abre el editor Bluefish y escribe el siguiente código en un archivo nuevo llamado script.js:
alert("Bienvenido a la programación en JavaScript!");
Guarda el archivo y ábrelo en un navegador para ver el mensaje emergente.
Ejercicio 2: Declarando Variables
Declara las siguientes variables en un archivo JavaScript y muestralas en consola:
- Un nombre de usuario.
- Su edad.
- Si le gusta la programación (true/false).
Ejemplo de salida esperada:
let usuario = "Carlos";
let edad = 16;
let gustaProgramar = true;
console.log("Usuario: " + usuario);
console.log("Edad: " + edad);
console.log("¿Le gusta programar? " + gustaProgramar);
Ejercicio 3: Corrigiendo Errores
Encuentra los errores en el siguiente código y corrígelos:
let nombre = "Ana";
const edad = 17;
edad = 18; // ¿Es posible cambiar el valor de una constante?
consolelog(nombre);
Comentarios
Publicar un comentario