Módulo 3: JavaScript Básico
Lección 1: Introducción a JavaScript
Objetivos:
· Entender qué es JavaScript y su importancia en la web.
· Aprender la sintaxis básica y la creación de variables.
1. ¿Qué es JavaScript?
JavaScript es un lenguaje de programación que se utiliza para crear contenido dinámico en las páginas web. Esencialmente, permite que las páginas web sean interactivas y respondan a las acciones de los usuarios.
2. Sintaxis básica de JavaScript
La sintaxis de JavaScript define cómo se estructuran las declaraciones y comandos. Aquí tienes algunos elementos básicos:
· Comentarios: Se utilizan para dejar notas en el código.
javascript
// Este es un comentario de una sola línea.
/* Este es un comentario
de varias líneas. */
· Variables: Almacenan datos que pueden cambiar durante la ejecución del programa.
javascript
var nombre = "Juan";
let edad = 25;
const PI = 3.14;
3. Tipos de datos
JavaScript admite varios tipos de datos básicos, como:
· Números: Enteros y decimales.
javascript
let numero = 42;
let decimal = 3.14;
· Cadenas de texto: Texto delimitado por comillas.
javascript
let saludo = "Hola, mundo!";
· Booleanos: Valores verdaderos o falsos.
javascript
let esVerdadero = true;
let esFalso = false;
4. Operadores
JavaScript utiliza operadores para realizar cálculos y comparaciones.
· Aritméticos:
javascript
let suma = 5 + 3; // 8
let resta = 10 - 7; // 3
let multiplicacion = 4 * 2; // 8
let division = 20 / 5; // 4
· Comparación:
javascript
let igual = 5 == 5; // true
let diferente = 5 != 3; // true
let mayor = 7 > 4; // true
5. Ejemplo de script básico
Veamos un pequeño ejemplo de JavaScript que muestra un mensaje en la consola del navegador:
html
<!DOCTYPE html>
<html>
<head>
<title>Práctica de JavaScript</title>
</head>
<body>
<h1>Bienvenido a JavaScript</h1>
<script>
// Este es un mensaje en la consola
console.log("Hola, mundo!");
// Definir una variable y mostrarla en la consola
let nombre = "Juan";
console.log("Hola, " + nombre);
</script>
</body>
</html>
Abre el archivo en tu navegador y usa la herramienta de desarrollador (F12 o Ctrl+Shift+I) para ver la consola y el mensaje.
·
Ejercicio práctico:
Crea un archivo HTML y escribe el código anterior. Experimenta cambiando el nombre y observa cómo afecta el mensaje en la consola.
