Objetos Predefinidos y BOM

1. No hace falta reinventar la rueda

Buena parte de programar bien consiste en saber qué te da ya hecho el lenguaje. JavaScript trae de serie una colección de objetos predefinidos con cientos de métodos para trabajar con textos, números, fechas y listas, y el navegador añade otros para controlar la ventana, la dirección de la página o el almacenamiento. Si antes de escribir un bucle te preguntas «¿esto no existirá ya?», casi siempre la respuesta es sí.

2. Textos

Los textos son inmutables: ningún método cambia el texto original, todos devuelven uno nuevo. Es el error más común al empezar: escribir nombre.toUpperCase(); y esperar que nombre haya cambiado. Hay que guardar el resultado: nombre = nombre.toUpperCase();.

3. Números y el objeto Math

Para convertir un texto en número tienes tres opciones que no se comportan igual. Number("12px") es NaN porque exige que todo el texto sea un número; parseInt("12px") es 12 porque lee hasta donde puede; y parseFloat("3.5 kg") es 3.5. Para datos de formularios, Number es la opción más segura: si el usuario escribe algo raro te enteras.

Math es un objeto con funciones matemáticas: Math.round, Math.floor y Math.ceil redondean, Math.max y Math.min buscan extremos, Math.abs, Math.sqrt… Y Math.random() devuelve un decimal entre 0 (incluido) y 1 (excluido), con el que se construye cualquier número aleatorio:

1// Entero aleatorio entre min y max, ambos incluidos
2function aleatorio(min, max) {
3  return Math.floor(Math.random() * (max - min + 1)) + min;
4}
5
6const dado = aleatorio(1, 6);
7const precio = 19.999;
8console.log(precio.toFixed(2));   // "20.00" (texto, para mostrar)

4. Fechas y formatos regionales

El objeto Date guarda un instante como el número de milisegundos desde el 1 de enero de 1970. Tiene una trampa histórica que todo el mundo sufre una vez: los meses empiezan en 0. new Date(2025, 0, 15) es el 15 de enero, y getMonth() devuelve 0 para enero y 11 para diciembre. Los días del mes, en cambio, empiezan en 1.

1const ahora = new Date();
2const examen = new Date("2025-06-20");        // formato ISO: año-mes-día
3const faltan = examen - ahora;                 // restar fechas da milisegundos
4
5console.log(examen.getFullYear(), examen.getMonth() + 1, examen.getDate());
6console.log(examen.toLocaleDateString("es-ES", { weekday: "long", day: "numeric", month: "long" }));
7// "viernes, 20 de junio"

Para mostrar números, monedas y fechas al estilo de cada país no construyas el texto a mano: usa Intl, la API de internacionalización. Sabe que en España el decimal es una coma, que el euro va detrás y cómo se escriben los meses en cada idioma.

1const euros = new Intl.NumberFormat("es-ES", { style: "currency", currency: "EUR" });
2euros.format(1234.5);                          // "1234,50 €"
3
4const porcentaje = new Intl.NumberFormat("es-ES", { style: "percent" });
5porcentaje.format(0.21);                       // "21 %"
6
7new Intl.RelativeTimeFormat("es", { numeric: "auto" }).format(-1, "day");   // "ayer"

5. Arrays: los métodos que usarás a diario

Un array es una lista ordenada de valores de cualquier tipo. Además de añadir y quitar elementos, tiene una familia de métodos que reciben una función y la aplican a cada elemento. Dominar map, filter y reduce cambia tu forma de programar: en lugar de explicar al ordenador cómo recorrer la lista con un bucle, le dices qué quieres obtener.

1const productos = [
2  { nombre: "Teclado", precio: 25, stock: 4 },
3  { nombre: "Monitor", precio: 180, stock: 0 },
4  { nombre: "Ratón", precio: 12, stock: 10 },
5];
6
7const disponibles = productos.filter((p) => p.stock > 0);
8const nombres = disponibles.map((p) => p.nombre);                     // ["Teclado", "Ratón"]
9const valorStock = productos.reduce((total, p) => total + p.precio * p.stock, 0);   // 220
10const porPrecio = productos.toSorted((a, b) => a.precio - b.precio);   // del más barato al más caro

JSON

JSON es el formato con el que viajan los datos entre el navegador y el servidor. Se parece mucho a los objetos de JavaScript, con dos diferencias: las claves van siempre entre comillas dobles y no admite funciones ni undefined. JSON.stringify(objeto) convierte un objeto en texto y JSON.parse(texto) hace lo contrario (y lanza un error si el texto no es JSON válido).

6. Los objetos del navegador (BOM)

El BOM (Browser Object Model) es el conjunto de objetos que el navegador pone a tu disposición. Todos cuelgan de window, que representa la pestaña y es el objeto global: por eso puedes escribir alert() en lugar de window.alert().

Temporizadores

setTimeout(funcion, ms) ejecuta una función una vez pasado un tiempo, y setInterval(funcion, ms) la ejecuta repetidamente. Los dos devuelven un identificador que sirve para cancelarlos con clearTimeout o clearInterval. El tiempo es un mínimo, no una garantía: si el navegador está ocupado o la pestaña está en segundo plano, puede tardar más.

localStorage solo guarda texto, así que para guardar objetos se combinan con JSON: localStorage.setItem("carrito", JSON.stringify(carrito)) y JSON.parse(localStorage.getItem("carrito") ?? "[]"). Nunca guardes ahí contraseñas ni datos sensibles: cualquier script de la página puede leerlo.

(sin mensajes)

7. Retos

Cada reto se resuelve con pocas líneas si eliges bien los métodos. Si te encuentras escribiendo un bucle largo, vuelve a mirar las tablas del tema.