¿Qué es TypeScript? Guía en lenguaje sencillo para no programadores

TypeScript es JavaScript con tipos. Añades etiquetas que indican qué clase de dato debe ser cada valor (un número, un texto, una lista de pedidos), y TypeScript comprueba que tu código no tenga incoherencias antes de ejecutarse. El sitio de TypeScript lo describe como «JavaScript con sintaxis para tipos»; los tipos se eliminan al convertir el código en JavaScript normal, que luego se ejecuta en cualquier lugar donde funcione JavaScript.

Por qué importa cuando creas con IA

Los modelos de IA escriben código rápido, y el código rápido tiene errores: un campo llamado customerName en un archivo y customer_name en otro, un precio pasado como texto en lugar de como número, una función llamada sin un valor obligatorio. En JavaScript normal, muchos de esos errores solo aparecen cuando alguien pulsa el botón equivocado.

TypeScript detecta muchos de ellos antes, mientras se escribe el código:

• La IA recibe retroalimentación inmediata. Los errores de tipo señalan la línea exacta que está mal, así que el agente puede corregirla antes de que la veas.
• Los cambios son más seguros. Si renombras un campo, TypeScript marca cada lugar que sigue usando el nombre antiguo.
• El código se explica solo. Los tipos documentan lo que espera y devuelve una función, lo que ayuda a ti, a la IA y a cualquier desarrollador que trabaje después en él.
• Los editores son más inteligentes. El autocompletado y «ir a la definición» funcionan mejor porque el editor sabe qué es cada valor.

Esta es una de las grandes razones por las que muchos creadores de apps con IA usan TypeScript por defecto.

Una analogía cotidiana

Piensa en un almacén de envíos con zonas etiquetadas. Cada zona tiene un cartel: «Solo palés», «Refrigerado», «Máximo 500 kg». Cuando llega una entrega, un controlador en la puerta compara la mercancía con el cartel. El pescado congelado que va hacia la zona de productos secos se detiene en la puerta, no se descubre una semana después cuando ya huele mal.

TypeScript es ese controlador de la puerta. Los tipos son los carteles. La comprobación ocurre antes de que la mercancía (tu código) entre en uso. Y, una vez todo está en su sitio, los carteles se retiran: el JavaScript que se ejecuta no tiene tipos.

Cómo funciona TypeScript

1. Tú (o la IA) escribes archivos .ts o .tsx: TypeScript, con etiquetas de tipo.
2. El comprobador de tipos lee el código e informa de las incoherencias como errores en el editor o en la compilación.
3. Un paso de compilación elimina los tipos, generando JavaScript normal.
4. El JavaScript se ejecuta en el navegador o en un servidor (Node.js, Deno, Bun).

Una consecuencia importante: TypeScript comprueba el código que escribiste, no los datos que llegan mientras la app está en marcha. Si una API externa devuelve algo inesperado, TypeScript no lo ve a menos que añadas validación en tiempo de ejecución.

Un ejemplo práctico: un formulario de reservas

Supón que estás creando una app de reservas para una peluquería. Este es un tipo que describe una reserva:

type Booking = {
  id: number;
  customerEmail: string;
  service: "haircut" | "colour" | "blow-dry";
  startsAt: Date;
  price: number;
  notes?: string; // el ? indica que es opcional
};

Y una función que calcula un depósito:

function depositFor(booking: Booking): number {
  return booking.price * 0.2;
}

Ahora veamos qué detecta TypeScript.

Un campo mal escrito.

depositFor({ id: 1, customerEmail: "lena@example.com", service: "haircut",
  startsAt: new Date(), prise: 40 });

TypeScript informa de que prise no es una propiedad conocida y de que falta price. En JavaScript normal, esto calcularía en silencio un depósito de NaN (no es un número).

Un tipo de valor incorrecto.

const booking: Booking = { ...otherFields, price: "40" };

TypeScript informa de que una cadena de texto no puede usarse donde se espera un número. Sin él, "40" * 0.2 funciona por casualidad, pero "40" + 5 da "405": el tipo de error que aparece en una factura.

Un servicio que no existe.

const booking: Booking = { ...otherFields, service: "perm" };

TypeScript informa de que "perm" no es uno de los servicios permitidos. Cuando más adelante la peluquería añada permanentes, la añades al tipo, y TypeScript muestra cada lugar que necesita actualizarse: la lista de precios, el formulario, los colores del calendario.

Lo que no puede detectar. Si el formulario de reservas envía price: "40" desde el navegador al servidor, TypeScript del servidor no lo ve en tiempo de ejecución. Por eso las apps bien hechas también validan los datos entrantes, a menudo con una biblioteca de validación que comprueba la forma y los convierte en un Booking correcto.

TypeScript frente a JavaScript

Términos comunes explicados

Errores comunes y falsas creencias

• «TypeScript hace que el código no tenga errores». Detecta incoherencias en la forma de los datos, no una lógica incorrecta. Un depósito del 2 % en lugar del 20 % pasa la comprobación de tipos sin problema.
• «Los tipos me protegen de entradas incorrectas». Los tipos desaparecen en tiempo de ejecución. Valida los datos de usuarios, formularios y APIs.
• any por todas partes. Cuando una IA se atasca, puede recurrir a any o a // @ts-ignore para silenciar los errores. Eso oculta los problemas en lugar de resolverlos.
• Ignorar los errores de tipo porque la vista previa funciona. Algunas herramientas siguen ejecutando código con errores de tipo. Aun así, esos errores son fallos esperando a producirse.
• «TypeScript es más lento». Los tipos se eliminan antes de ejecutar; el JavaScript que se ejecuta es prácticamente el mismo.
• «Solo es para equipos grandes». Los creadores en solitario también se benefician, sobre todo cuando una IA hace la mayoría de los cambios.

Qué pedir a tu creador con IA

• «Usa TypeScript con el modo estricto activado».
• «Define tipos compartidos para nuestros registros principales (Customer, Booking, Invoice) y úsalos tanto en el frontend como en el backend».
• «No uses any ni @ts-ignore para saltarte errores; corrige el problema de fondo y dime cuál era».
• «Valida todos los datos entrantes en el servidor, no solo con tipos».
• «Ejecuta el comprobador de tipos y corrige todos los errores antes de decirme que está terminado».
• «Cuando renombres un campo, actualiza todos los lugares que marque TypeScript».
• «Explícame este error de tipo en lenguaje sencillo».

Para comprobar lo que produjo la IA, consulta cómo revisar código generado por IA y cómo depurar una app creada con IA.

TypeScript en Mythex

Cuando no pides nada concreto, Mythex empieza los proyectos nuevos con Vite + React + TypeScript + Tailwind. El editor de código incluye inteligencia del lenguaje (autocompletado, diagnósticos e ir a la definición para TypeScript y JavaScript, entre otros), así que los errores de tipo se ven en el código, no solo en la vista previa. El editor es de solo lectura en Free y totalmente editable en Pro. Aun así puedes pedir otra configuración en tu primer prompt; la página de la documentación sobre cómo se elige la tecnología explica cómo, y los documentos del editor de código detallan lo que muestra el editor.

Preguntas