Lenguaje Javascript

Lenguaje de programación interpretado utilizado en el lado del cliente (front-end) para dotar de mejoras dinámicas e interactivas a las páginas web.

← Volver Guía rápida Más sobre ManzDev

Introducción a Javascript

¿Qué es Javascript? Lenguaje de programación de la web

La consola Javascript Mostrando información y errores en el navegador

¿Cómo funciona Javascript? Como cargar un archivo Javascript

La especificación ECMAScript Normas y reglas de funcionamiento de Javascript

Tipos de datos Naturaleza del contenido de una variable

Funciones Fragmentos de código en bloques reutilizables

Operadores básicos Operadores básicos en Javascript

Operadores avanzados Operadores avanzados en Javascript

Number

¿Qué es un Number? Variables con contenido numérico

¿Qué es NaN (Not A Number)? Valor en contexto numérico que no es posible representar

Conversiones numéricas Convertir textos a número (o viceversa)

El objeto Math Operaciones matemáticas

El tipo BigInt Números grandes en Javascript

Strings

¿Qué es un String? Variables con contenido de texto

Posiciones y substrings Obtener índices o fragmentos de texto

Buscar y reemplazar Búsqueda y/o reemplazo de fragmentos de textos

Modificar cadenas de texto Realizar transformaciones en Strings

Contenido de texto Unicode Utilizar símbolos, carácteres extendidos o emojis

Objetos

¿Qué son los objetos? Estructuras de datos tipo diccionario

Formato JSON Formato ligero de datos basado en Javascript

Desestructuración de objetos Desestructurar datos en objetos. Spread y rest

Clonar objetos o elementos Formas de copiar estructuras de datos en Javascript

Iteradores de objetos Convertir objetos a arrays

Arrays

¿Qué es un Array en Javascript? Colección de datos en una estructura ordenada

Buscar elementos en un array Buscar elementos o su posición en un array

Modificar o crear subarrays Alterar arrays existentes o crear fragmentos de array

Ordenación de un array Ordenar elementos de un array en Javascript

Array functions Funciones sobre objetos basados en Array

Desestructuración de arrays Desestructurar datos en arrays. Spread y rest

Set / Map

¿Qué es un Set? Conjuntos: Estructura de datos no repetidos

Set: Operaciones de conjuntos Unión, Intersección, Diferencia y Exclusión

¿Qué es un Map? Mapa: Estructura de datos de pares clave-valor

Calidad de código

ESLint: Linter Javascript Revisión de errores o problemas

Módulos

¿Qué son los módulos (ESM)? ESM: ECMAScript Modules

Exportar módulos La palabra clave export

Importar módulos La palabra clave import

Import dinámico en Javascript Importar módulos en Javascript en tiempo real

Import Maps Controla las rutas o URL de donde se descargan los módulos

Orientación a objetos (OOP)

Orientación a objetos Programación orientada a objetos

Clases en Javascript Estructura de datos para crear objetos

Propiedades de clase ¿Qué es una propiedad de clase?

Métodos de clase ¿Qué es un método en una clase?

Herencia de Clases Extender y reutilizar la funcionalidad de otra clase

DOM

¿Qué es el DOM? Estructura de objetos HTML en un documento web

Seleccionar elementos del DOM Búsqueda de elementos HTML desde Javascript

Crear elementos en el DOM Creando elementos HTML de forma dinámica

Gestionar atributos del DOM Crear o manipular atributos HTML desde Javascript

La API classList de Javascript Manipular clases CSS de una etiqueta HTML

Contenido en el DOM Acceder al contenido de una etiqueta HTML

Insertar elementos en el DOM Formas de añadir elementos en una página

Navegar por elementos del DOM Moverse por la estructura de elementos HTML

Animar elementos del DOM Animaciones con Javascript (Web Animations)

Eventos

¿Qué son los eventos? Introducción a la programación orientada a eventos

Eventos mediante HTML Gestionar eventos Javascript desde el HTML

Eventos mediante Javascript Gestionar eventos Javascript desde propiedades del DOM

El método addEventListener Gestionar eventos Javascript mediante el método addEventListener

Escuchar eventos y handleEvent Formas de escuchar y manejar eventos Javascript

Eventos nativos Cómo gestionar los eventos Javascript

Eventos personalizados Crear eventos personalizados propios

Eventos del navegador Eventos de teclado, ratón, formularios, etc...

Emisión de eventos Cómo emitir eventos (burbujeo y captura)

Propagación de eventos Como gestionar y manejar la propagación de eventos

Fechas y horas

El tipo Date Fechas nativas en Javascript

Formatear fechas con Intl Internacionalización y conversión de fechas

Fechas relativas con Intl Fechas relativas del tipo «Hace X minutos...»

Formatear fechas con dayjs Librería Javascript para dar formato a fechas

Expresiones regulares

¿Qué es una expresión regular? Patrones para buscar, capturar o reemplazar texto

Propiedades y flags Información sobre una expresión regular

Buscar y capturar textos Funciones para ejecutar búsquedas mediante RegExp

Crear expresiones regulares Carácteres especiales dentro de las expresiones regulares

Multimedia

API de Audio Javascript API multimedia para reproducir audio o video

Web APIs

Temporizadores Los métodos setTimeout, setInterval y requestAnimationFrame

SpeechSynthesis (TTS) Sintetizador de voz nativo

Asincronía

¿Qué es la asincronía? El mecanismo de ejecución no secuencial de Javascript

Funciones callbacks Callbacks o retrollamadas

¿Qué son las promesas? Código asíncrono que se ejecutará en el futuro

Async/Await Usar promesas de forma aparentemente síncrona

Promesas en grupo (Promise API) Controlar la ejecución de grupos de promesas

Peticiones HTTP

AJAX: Peticiones HTTP Peticiones asíncronas y transparentes desde Javascript

XHR: XMLHttpRequest Mecanismo (legacy) para hacer peticiones asíncronas

Fetch: Peticiones Asíncronas Mecanismo moderno para hacer peticiones asíncronas

URL en Javascript Trabajando con direcciones URL en Javascript

Política CORS Mecanismo de seguridad para evitar peticiones

Aprender más

Si lo prefieres, puedes aprender también sobre estas temáticas:

¿Quién soy yo?

Soy Manz, vivo en Tenerife (España) y soy streamer partner en Twitch y profesor. Me apasiona el universo de la programación web, el diseño y desarrollo web y la tecnología en general. Aunque soy full-stack, mi pasión es el front-end, la terminal y crear cosas divertidas y locas.

Puedes encontrar más sobre mi en Manz.dev