Unidad 1
Introducción a JavaScript
Qué es JavaScript, por qué es el lenguaje del navegador y un primer programa que saluda.
JavaScript, el lenguaje de la web
Una página web se construye con tres tecnologías que se reparten el trabajo: HTML describe el contenido, CSS define el aspecto y JavaScript aporta el comportamiento. Es el único lenguaje de programación que todos los navegadores ejecutan de forma nativa, y por eso se le llama el lenguaje de la web.
Cuando el código se ejecuta en el navegador de quien visita la página hablamos de desarrollo en el lado del cliente. Es el tema de este módulo.
Qué aporta JavaScript en el lado del cliente
- Dinamismo y asincronía. La página puede pedir contenido al servidor sólo cuando hace falta y mostrarlo sin recargar la página completa. Es lo que permite que un buscador sugiera resultados mientras escribes o que un listado cargue más elementos al llegar al final.
- Mejor experiencia de usuario. Las interfaces responden al instante, porque la lógica corre en la máquina del usuario y no hay que esperar una respuesta del servidor para cada acción: validar un formulario, desplegar un menú, filtrar una tabla.
- Fácil de integrar. Basta con incluir el código en el documento HTML,
con una etiqueta
<script>, para que el navegador lo interprete. No hay que compilar ni instalar nada. - Alta compatibilidad. Funciona en todos los navegadores actuales, y una vez cargada la página sigue funcionando aunque se pierda la conexión. También sirve para cubrir lo que CSS no alcanza a resolver, como comportamientos de diseño que dependen del estado de la página.
JavaScript fuera del navegador: Node.js
Node.js es un entorno que ejecuta JavaScript sin necesidad de un navegador. Convierte tu máquina en un servidor web y permite usar el mismo lenguaje en el lado del servidor.
- Rendimiento y escalabilidad. Está construido sobre V8, el motor de JavaScript de Google Chrome, lo que permite desarrollar aplicaciones web rápidas y que crecen bien con el número de usuarios.
- Aplicaciones en tiempo real. Está especialmente indicado para aplicaciones con un consumo intenso de datos y muchas conexiones simultáneas, como chats, paneles que se actualizan solos o juegos en línea.
- Un solo lenguaje para toda la pila. Con Node.js, el mismo equipo y el mismo código pueden trabajar tanto en el cliente como en el servidor.
En este módulo trabajaremos en el navegador, pero todo lo que aprendas del lenguaje sirve igual en Node.js.
Un primer programa
La tradición manda que el primer programa en cualquier lenguaje muestre un
saludo. En JavaScript, la forma más directa de mostrar algo es
console.log:
console.log('Hola');console.log escribe en la consola del navegador lo que le pases entre los
paréntesis. Es la herramienta que más vas a usar para ver qué está haciendo
tu código. Un texto va siempre entre comillas: sin ellas, JavaScript
intentaría buscar una variable que se llame Hola y daría error.
¿Comillas simples o dobles?
En JavaScript da igual: ‘hola’ y “hola” son el
mismo texto. Lo importante es abrir y cerrar con la misma. En este
material usamos comillas simples.
Ejercicio: ¡Hola, mundo!
Escribe una instrucción que muestre en la consola exactamente el texto ¡Hola, mundo! (con los dos signos de exclamación y la coma).
// Escribe aquí tu console.log
Salida de consola
Sin salida todavía.Los tests se muestran al ejecutar.
Cómo funciona el ejercicio
El botón Ejecutar corre tu código en el navegador y después lanza los tests, que comprueban lo que ha aparecido en la consola. Si un test falla, el mensaje te dice qué esperaba y qué ha recibido. Puedes ejecutar tantas veces como quieras: no se guarda nada fuera de tu navegador ni cuenta para la nota.