Definición
JavaScript es el lenguaje de programación de la web. Es el único que los navegadores ejecutan de forma nativa, y esa exclusividad explica buena parte de su historia y de sus rarezas.
Si HTML es la estructura y CSS el aspecto, JavaScript es el comportamiento: reaccionar a un clic, validar un formulario, pedir datos a un servidor sin recargar la página, animar algo.
Desde 2009 también corre fuera del navegador con Node.js, lo que permite escribir el servidor en el mismo lenguaje que el cliente. Hoy verás JavaScript en webs, en servidores, en aplicaciones de escritorio con Electron y en aplicaciones móviles.
Un apunte de nombre que confunde a todo el mundo: JavaScript no tiene nada que ver con Java. El nombre fue una decisión de marketing de 1995 y arrastra malentendidos desde entonces.
Cómo funciona
Tres características lo definen:
Interpretado y de tipado dinámico. No se compila antes: el navegador lo lee y lo ejecuta. Una variable puede contener un número y después un texto sin que nadie proteste. Eso da flexibilidad y también errores que solo aparecen en producción — de ahí que exista TypeScript.
De un solo hilo, pero asíncrono. Solo hace una cosa a la vez, y aun así puede pedir datos a un servidor sin bloquear la página. El truco es el bucle de eventos: cuando lanza una operación lenta, no espera. Sigue con lo siguiente y, cuando la operación termina, ejecuta la función que dejaste preparada.
Manipula el DOM. En el navegador puede leer y cambiar cualquier elemento de la página en vivo.
El código asíncrono
Es el concepto que más cuesta al principio. Tres formas históricas de escribirlo:
// 1. Callbacks: la forma antigua. Anidando, se vuelve ilegible.
pedirDatos(function (datos) { /* ... */ });
// 2. Promesas: encadenables, mucho mejor.
pedirDatos().then(datos => { /* ... */ });
// 3. async/await: lo que se usa hoy. Se lee como código normal.
const datos = await pedirDatos();
async/await es azúcar sintáctico sobre las promesas: por debajo es lo mismo, pero se lee de arriba abajo.
Ejemplo práctico
El buscador semántico del diccionario de esta web es JavaScript de principio a fin, y es un buen ejemplo de lo que se puede hacer sin servidor.
Cuando escribes una pregunta, el navegador carga un modelo de IA, convierte tu frase en un vector, la compara contra los 101 términos ya calculados y ordena los resultados. Todo eso ocurre en tu ordenador: no hay una llamada a ningún servidor, no hay coste por consulta y lo que escribes no sale de tu máquina.
Lo interesante para entender el lenguaje es que ese modelo pesa unos 60 MB y tarda en descargarse. Si el código fuera síncrono, la web se quedaría congelada durante la descarga. Al ser asíncrono, la página sigue respondiendo, muestra una barra de progreso y activa el buscador cuando el modelo está listo.
Ese es exactamente el problema para el que se diseñó el modelo asíncrono de JavaScript.
Errores comunes
- Comparar con
==en vez de===. El doble igual convierte tipos antes de comparar, y"0" == falseda verdadero. Usa siempre===. - Olvidar el
await. Sin él no tienes el dato: tienes una promesa. Es la causa del clásico[object Promise]en pantalla. - No capturar errores en código asíncrono. Un
awaitsintry/catchque falla puede tumbar la página entera. - Confundir
nullconundefined.undefinedes "no tiene valor asignado";nulles "vale expresamente nada". - Modificar el DOM dentro de un bucle. Cada cambio puede forzar al navegador a recalcular la página. Prepara todo y aplícalo de una vez.
- Confiar en la validación del navegador. Todo lo que valides en el cliente hay que volver a validarlo en el servidor: el usuario puede saltarse el JavaScript.
Cuándo usarlo
En el navegador no hay alternativa: todo lo que sea interactividad pasa por ahí.
En el servidor sí la hay, y la elección es de contexto. Node.js va muy bien para APIs con mucha entrada y salida y poco cálculo, y tiene la ventaja de usar un solo lenguaje en todo el proyecto. Para cálculo intensivo o para integrarte con un ecosistema concreto, otros lenguajes encajan mejor.
Un consejo que doy siempre: no metas JavaScript donde no hace falta. Muchas webs cargan cientos de kilobytes para hacer algo que HTML y CSS resuelven solos. Cada kilobyte de JavaScript se descarga, se interpreta y se ejecuta, y eso se paga en velocidad.
