Saltar al contenido

JS

Formato JS: El Lenguaje que Hizo Interactiva la Web

5 min read

Formato JS: El Lenguaje que Hizo Interactiva la Web

Si estás utilizando un sitio web moderno, estás experimentando la magia de JavaScript. Cuando haces clic en un botón de "Me gusta" y este se vuelve azul instantáneamente sin recargar la página, eso es JavaScript. Cuando un carrusel de imágenes se desliza hacia la siguiente foto, cuando aparece una ventana de chat o cuando un juego basado en la web se ejecuta en tu navegador, todo eso es JavaScript.

JavaScript es el tercer pilar de la World Wide Web, junto con HTML (la estructura) y CSS (el diseño). Un archivo .js contiene código JavaScript, transformando páginas web estáticas en aplicaciones dinámicas e interactivas.

En esta guía, exploraremos qué es un archivo JS, la increíble historia de JavaScript, cómo funciona en el navegador y cómo evolucionó para conquistar no solo la web, sino también servidores y aplicaciones móviles.

¿Qué es un Archivo JS?

Un archivo .js es un archivo de texto sin formato (plain text) que contiene código escrito en el lenguaje de programación JavaScript.

A diferencia de HTML y CSS, que son lenguajes de marcado y estilo, JavaScript es un lenguaje de programación completo y Turing completo. Puede realizar cálculos matemáticos, manipular datos, tomar decisiones basadas en la lógica (declaraciones if/else) y hablar con servidores externos para enviar o recuperar datos.

Cómo se Conecta a la Web

Un navegador web lee un archivo .js y ejecuta el código línea por línea. Los desarrolladores suelen vincular un archivo .js a un documento HTML utilizando la etiqueta <script>:

<!-- Vinculando un archivo JS externo a un documento HTML -->
<script src="script.js"></script>

Una vez vinculado, el código JavaScript tiene acceso al DOM (Modelo de Objetos del Documento - Document Object Model). El DOM es una representación de la página HTML. JavaScript puede leer el DOM, cambiarlo, agregar nuevos elementos HTML o eliminar los existentes en tiempo real, todo sin requerir que el usuario actualice (recargue) la página.

La Historia de Origen: 10 Días en Mayo

La historia de JavaScript es una de las leyendas más famosas de la informática.

En 1995, la web era completamente estática. Una empresa llamada Netscape (creadores del navegador más popular en ese momento) quería hacer la web más dinámica. Contrataron a un programador llamado Brendan Eich para crear un lenguaje de secuencias de comandos (scripting language) que pudiera incrustarse directamente en las páginas web.

Bajo una inmensa presión para vencer a Microsoft en las "Guerras de los Navegadores", Eich diseñó y construyó el primer prototipo del lenguaje en solo 10 días.

Originalmente llamado Mocha, luego LiveScript, finalmente fue rebautizado como JavaScript como una táctica de marketing para aprovechar la popularidad del increíblemente famoso lenguaje de programación Java (a pesar de que los dos lenguajes casi no tienen nada en común arquitectónicamente).

Debido a que fue construido en 10 días, el JavaScript inicial tenía muchas peculiaridades y defectos. Durante años, los programadores "serios" se burlaron de él. Sin embargo, debido a que estaba integrado directamente en todos los navegadores web de la Tierra, poseía una ventaja imparable: distribución universal.

Sintaxis Básica de JavaScript

La sintaxis de JavaScript toma prestado mucho de C y Java. Aquí hay algunos conceptos básicos:

Variables y Datos

Las variables se utilizan para almacenar datos.

let nombreUsuario = "Alicia";  // Una cadena (texto)
const edad = 30;               // Un número (constante, no se puede cambiar)
let estaEnLinea = true;        // Un booleano (verdadero/falso)

Funciones

Las funciones son bloques de código reutilizables que realizan una tarea específica.

function saludarUsuario(nombre) {
    alert("¡Hola, " + nombre + "!");
}

// Llamando a la función
saludarUsuario(nombreUsuario); // Muestra una alerta que dice "¡Hola, Alicia!"

Manipulación del DOM

Así es como JavaScript cambia la página web.

// Encuentra un elemento HTML con el ID "mi-boton"
const boton = document.getElementById('mi-boton');

// Haz que el botón haga algo cuando se hace clic
boton.addEventListener('click', function() {
    document.body.style.backgroundColor = 'red'; // Vuelve el fondo rojo
});

La Revolución AJAX (Web 2.0)

Durante la primera década de su existencia, JavaScript se usó principalmente para molestos anuncios emergentes (pop-ups) o para la validación simple de formularios.

Todo cambió a mediados de la década de 2000 con la popularización de AJAX (JavaScript y XML Asíncronos). AJAX permitió a JavaScript comunicarse con un servidor en segundo plano sin recargar la página.

Cuando Google lanzó Google Maps (2005) y Gmail (2004), utilizaron AJAX de forma extensiva. Los usuarios podían arrastrar un mapa, y los nuevos mosaicos del mapa se cargaban sin problemas en segundo plano. Esto demostró que JavaScript podía usarse para crear software complejo y similar al de escritorio directamente en el navegador, marcando el comienzo de la era de la "Web 2.0".

JavaScript se Come el Mundo

Hoy en día, JavaScript se clasifica constantemente como el lenguaje de programación más popular del mundo. Su ecosistema es masivo y se ha expandido mucho más allá del navegador web.

  • Frameworks Frontend: Herramientas como React, Vue y Angular permiten a los desarrolladores crear aplicaciones de una sola página (SPA) increíblemente complejas de forma rápida y eficiente.
  • Node.js (Backend): En 2009, Ryan Dahl creó Node.js, un entorno que permite que JavaScript se ejecute en servidores. Esto significaba que los desarrolladores podían usar exactamente el mismo lenguaje tanto para el frontend (navegador) como para el backend (servidor).
  • Aplicaciones Móviles: Frameworks como React Native permiten a los desarrolladores escribir código JavaScript que se compila en aplicaciones nativas de iOS y Android.
  • Aplicaciones de Escritorio: Frameworks como Electron (que impulsa aplicaciones como Slack, Discord y VS Code) permiten a los desarrolladores crear software de escritorio utilizando HTML, CSS y JavaScript.

Conclusión

Desde un prototipo apresurado construido en 10 días hasta el rey indiscutible del desarrollo de software, el viaje de JavaScript es notable. El formato .js es el motor del Internet moderno. Aportó interactividad a la web estática, desdibujó las líneas entre los sitios web y el software de escritorio, y creó un lenguaje unificado que puede ejecutarse en prácticamente cualquier dispositivo del planeta. Si deseas crear para la web, aprender JavaScript no es solo una opción; es una necesidad absoluta.

Buy me a coffee