Qué es TypeScript

En esta clase vamos a dejar una cosa clarísima desde el minuto 1: TypeScript es JavaScript con tipos. Y sí, esto no es solo un eslogan, es la idea central del lenguaje.

El superset de JavaScript

TypeScript es un lenguaje de programación creado por Microsoft y es un superset de JavaScript.

Cuando decimos superset queremos decir esto:

• Todo código JavaScript válido es también TypeScript válido (a nivel de sintaxis).
• TypeScript añade por encima una capa de tipos para ayudarte a detectar errores antes de ejecutar el código.

Nota: TypeScript tiene alguna sintaxis propia, pero el objetivo es que sea cada vez más “JS + tipos”.

La diferencia clave: tipado

TypeScript no es “otro JavaScript” - la diferencia importante es cómo maneja los tipos:

• JavaScript: tipado dinámico y débil
• TypeScript: tipado estático y fuerte

Dinámico vs estático

Esto habla de cuándo se comprueban los tipos:

• Dinámico: los tipos se conocen en tiempo de ejecución
• Estático: el compilador puede analizar los tipos antes de ejecutar

Débil vs fuerte

Esto habla de si el lenguaje hace conversiones implícitas de tipos:

• Débil: puede convertir tipos “por su cuenta”
• Fuerte: no te deja mezclar o convertir tipos libremente

Ejemplo práctico: el típico “me lo convierte y ni me avisa”

En JavaScript:

function double(n) {
  return n * 2
}

double(10) // 20
double('4') // 8  <- JavaScript convierte "4" a número sin preguntarte

¿Por qué pasa esto?

• El tipo real de n se conoce cuando el programa se ejecuta
• Además, JavaScript es débil y convierte "4" en número para poder multiplicar

Ahora en TypeScript, solo con pasar el archivo a .ts y tipar el parámetro:

function double(n: number) {
  return n * 2
}

double(10) // OK
double('4') // Error: no es un number

¿Qué ganamos?

• El compilador revisa el código antes de ejecutar
• Ya no cuelan conversiones implícitas - si intentas pasar un string, te lo para

Cómo funciona TypeScript por dentro

Es muy importante que entiendas esto: TypeScript no se ejecuta directamente. Ningún navegador ni motor de JavaScript entiende TypeScript de forma nativa.

Lo que ocurre es un proceso en dos fases:

1. Fase de análisis: el compilador de TypeScript (tsc) lee tu código, comprueba los tipos y te avisa de los errores.
2. Fase de transpilación: una vez validado, elimina todos los tipos y genera JavaScript puro.

// archivo: saludo.ts
function saludo(nombre: string): string {
  return `Hola, ${nombre}`
}

Después de compilar, el resultado es:

// archivo: saludo.js
function saludo(nombre) {
  return `Hola, ${nombre}`
}

¿Ves? Los tipos desaparecen. A esto se le llama type erasure (borrado de tipos). El JavaScript que se ejecuta no tiene ni rastro de TypeScript.

Nota: Node.js (desde la v22.6) soporta ejecutar archivos .ts directamente con --experimental-strip-types, y Deno tiene soporte nativo. Pero internamente hacen lo mismo: quitan los tipos antes de ejecutar.

Inferencia de tipos: no tienes que tiparlo todo

Un miedo muy común al empezar con TypeScript es pensar que hay que escribir tipos en todas partes. No es así. TypeScript tiene un sistema de inferencia muy potente:

// No necesitas escribir el tipo de retorno, TypeScript lo infiere
function double(n: number) {
  return n * 2 // TypeScript sabe que esto devuelve number
}

// Tampoco necesitas tipar las variables si las inicializas
const mensaje = 'Hola' // TypeScript infiere que es string
const edad = 25 // TypeScript infiere que es number
const activo = true // TypeScript infiere que es boolean

La regla de oro: tipa los parámetros de las funciones, y deja que TypeScript infiera el resto. Solo añade tipos explícitos cuando la inferencia no sea suficiente o quieras ser más específico.

Los tipos básicos que ya conoces

TypeScript tiene tipos que te suenan de JavaScript:

// Primitivos
const nombre: string = 'Ada'
const edad: number = 36
const esAdmin: boolean = false

// Arrays
const lenguajes: string[] = ['JavaScript', 'TypeScript', 'Python']
const notas: number[] = [10, 8, 9]

// Objetos
const usuario: { nombre: string; edad: number } = {
  nombre: 'Ada',
  edad: 36,
}

No te preocupes si parece mucho — en las próximas clases profundizaremos en cada uno y verás interfaces, tipos personalizados y más.

La válvula de escape: any

TypeScript tiene un tipo especial llamado any que básicamente le dice al compilador: “no compruebes nada aquí”.

let dato: any = 'hola'
dato = 42 // OK
dato = true // OK
dato.metodoQueNoExiste() // No da error en compilación... pero explotará en runtime

any existe para que puedas migrar código JavaScript a TypeScript de forma gradual, sin tener que tiparlo todo de golpe. Pero usarlo es renunciar a las ventajas de TypeScript. Piénsalo como quitar el cinturón de seguridad: puedes hacerlo, pero no deberías.

Regla práctica: si tienes un any en tu código, pregúntate si puedes cambiarlo por un tipo real. La mayoría de veces, sí puedes.

¿Por qué aprender TypeScript hoy?

TypeScript no es una moda pasajera. Estos son los datos:

• Es el lenguaje más demandado en ofertas de empleo de frontend y fullstack.
• Frameworks como Next.js, Angular, Nuxt y SvelteKit lo usan por defecto.
• Librerías como React, Express y Prisma incluyen tipos de primera clase.
• El propio VS Code (construido con TypeScript) te da autocompletado, refactorización y detección de errores gracias a los tipos.

No es que “esté de moda” — es que una vez que lo pruebas, no quieres volver. Tu editor te entiende, te avisa de errores al instante, y puedes refactorizar con confianza.

Lo que hemos aprendido

• TypeScript es un superset de JavaScript creado por Microsoft.
• “Superset” significa que JS válido también es TS válido (sintaxis).
• La diferencia importante es el tipado: JS (dinámico/débil) vs TS (estático/fuerte).
• TypeScript no se ejecuta directamente — se compila a JavaScript y los tipos desaparecen (type erasure).
• No tienes que tiparlo todo: la inferencia de tipos hace gran parte del trabajo.
• El tipo any es una válvula de escape, pero úsalo lo menos posible.
• Con tipos, TypeScript te ayuda a detectar errores antes de que exploten en runtime.