Aprende JavaScript desde cero

Un programa es una lista de instrucciones que el ordenador ejecuta en orden, de arriba abajo. En JavaScript, console.log() muestra en la consola lo que pongas entre los paréntesis: un texto entre comillas o el resultado de una operación.

Cada instrucción suele terminar en punto y coma. Lo que va detrás de // es un comentario: el ordenador lo ignora y sirve para explicar el código a quien lo lea.

Una variable es un nombre que guarda un valor para usarlo después. Con const declaras una que no vas a reasignar y con let una que sí puede cambiar. La antigua var se sigue entendiendo, pero hoy se prefieren las otras dos.

Los valores tienen un tipo: texto (string), número (number), verdadero o falso (boolean), y también undefined y null para «sin valor». El operador typeof te dice de qué tipo es algo.

Con if el programa ejecuta un bloque solo si se cumple una condición, y con else indicas qué hacer si no. Para comparar se usan === (igual), !== (distinto), <, >, <= y >=.

Usa siempre === en lugar de ==: el doble igual convierte los tipos antes de comparar y da resultados sorprendentes, como que "5" == 5 sea verdadero.

Un array es una lista ordenada de valores entre corchetes. Cada elemento tiene una posición que empieza en 0, y length te dice cuántos hay. Con push() añades uno al final.

Un bucle repite un bloque de código. for...of recorre los elementos de un array uno a uno, sin que tengas que llevar la cuenta de las posiciones.

Una función agrupa código con un nombre para reutilizarlo. Recibe datos (parámetros) y puede devolver un resultado con return. Así no repites la misma operación en varios sitios.

Además de function, existe la sintaxis de flecha =>, más corta, muy usada para funciones pequeñas.

Un objeto agrupa datos relacionados en pares clave–valor entre llaves. Accedes a cada valor con un punto (usuario.nombre) y puedes añadir o cambiar propiedades en cualquier momento.

JSON es un formato de texto basado en esta misma forma de escribir objetos y es el que usan casi todas las APIs. JSON.stringify() convierte un objeto en texto y JSON.parse() hace lo contrario.

Los arrays traen métodos que reciben una función y la aplican a cada elemento. filter() se queda con los que cumplen una condición, map() transforma cada uno y reduce() los combina en un solo valor, como una suma.

Estos métodos no modifican el array original: devuelven uno nuevo. Así el código es más fácil de seguir que con un bucle que va cambiando variables.

El DOM es la representación de la página que el navegador pone a disposición de JavaScript. Con document.querySelector() buscas un elemento usando un selector CSS y con textContent cambias su texto.

addEventListener() ejecuta una función cuando ocurre algo, como un clic. Usa textContent y no innerHTML para mostrar datos que escribe el usuario: así evitas que se cuele código.

Pedir datos a un servidor tarda, y JavaScript no se queda bloqueado esperando: trabaja con promesas, valores que llegarán más adelante. fetch() hace una petición y devuelve una promesa.

Dentro de una función async puedes escribir await para esperar a la promesa como si fuera código normal. Envuélvelo en try...catch para tratar los fallos de red.

Cuando un programa crece, se reparte en varios archivos llamados módulos. Con export decides qué ofrece cada archivo y con import lo usas en otro.

npm, el gestor de paquetes que viene con Node.js, descarga bibliotecas de otras personas y apunta en package.json cuáles usa tu proyecto, para que cualquiera pueda instalarlas con npm install.