INTRODUCCIÓN A JAVASCRIPT
El primer día haremos una toma de contacto con JavaScript. Aprenderás qué es JavaScript y su importancia en la programación. Configuraremos el entorno necesario para programar en JavaScript y aprenderás la sintaxis básica de este lenguaje.
1.1. Presentación de JavaScript:
- ¿Qué es JavaScript?
- Historia y evolución.
- ¿Por qué aprender JavaScript?
1.2. Configuración y entorno:
- Introducción a la consola del navegador.
- Introducción al IDE (Visual Studio Code).
1.3. Primeros pasos con JavaScript:
- «console.log()» y la consola del navegador.
- Sintaxis básica: variables y tipos de datos.
FUNDAMENTOS DE JAVASCRIPT
Aprenderás a utilizar operadores y expresiones, como operadores aritméticos, de comparación y lógicos. Además, conocerás los condicionales y bucles que se utilizan en JavaScript, así como la declaración y llamada de funciones.
2.1. Operadores y expresiones:
- Operadores aritméticos, de comparación y lógicos.
2.2. Estructuras de control:
- Condicionales («if», «else»).
- Bucles («for», «while»).
2.3. Funciones:
- Declaración y llamada de funciones.
- Parámetros y retorno de funciones.
MANIPULACIÓN DEL DOM
Conocerás el DOM y cómo JavaScript interactúa con el HTML de una web, y aprenderás a seleccionar y manipular elementos.
3.1. Introducción al DOM:
- ¿Qué es el DOM?
- Cómo JavaScript interactúa con el HTML.
3.2. Selección de elementos:
- «document.querySelector()» y «document.querySelectorAll()».
3.3. Manipulación de elementos:
- «setAttribute()», «getAttribute()».
- «createElement()», «appendChild()».
ARRAYS Y MÉTODOS IMPORTANTES
Veremos qué es un array, cómo crearlos y acceder a elementos del array. También veremos los métodos de arrays más importantes, así como las funciones matemáticas.
4.1. Introducción a los arrays:
- ¿Qué es un array?
- Creación y acceso a elementos del array.
4.2. Métodos de arrays importantes
- «push()»: agregar elementos.
- «sort()»: ordenar elementos.
4.3. Funciones matemáticas:
- «Math.random()»: generación de números aleatorios.
- «Math.floor()»: redondeo de números.
CREACIÓN DEL JUEGO DE MEMORIA
Crearemos un juego de memoria basado en la serie de animación «Pokémon». Para ello utilizaremos todo lo aprendido en los días anteriores.
5.1. Estructura del juego:
- Planificación del juego de memoria.
- HTML básico necesario.
5.2. Lógica del juego en JS:
- Creación de las cartas con «createElement()».
- Aleatorización de las cartas con «Math.random()» y «sort()».
- Adición de las cartas al DOM con «appendChild()».
5.3. Interacción del usuario:
- Manejo de eventos clic.
- Verificación de coincidencias usando «getAttribute()», y «setAttribute()».
- Uso del bucle «for para iterar sobre elementos.