Introducción a TypeScript para Desarrolladores JavaScript
2 min de lectura
Tabla de contenidos
## ¿Qué es TypeScript?
TypeScript es un superconjunto de JavaScript que añade tipado estático opcional al lenguaje. Fue desarrollado por Microsoft y se ha convertido en una herramienta esencial para proyectos de mediana y gran escala.
## Beneficios principales
### 1. Detección temprana de errores
Uno de los mayores beneficios de TypeScript es la capacidad de detectar errores en tiempo de compilación, antes de que tu código llegue a producción.
```typescript
// JavaScript permitiría esto sin error
function sumar(a, b) {
return a + b;
}
sumar("5", 3); // "53" - concatenación inesperada
// TypeScript previene este error
function sumar(a: number, b: number): number {
return a + b;
}
sumar("5", 3); // Error de compilación
```
### 2. Mejor autocompletado y documentación
Con TypeScript, tu IDE puede ofrecerte sugerencias más precisas y documentación integrada:
```typescript
interface Usuario {
id: number;
nombre: string;
email: string;
activo: boolean;
}
const usuario: Usuario = {
id: 1,
nombre: "Roberto",
email: "roberto@ejemplo.com",
activo: true
};
// El IDE ahora conoce todas las propiedades disponibles
console.log(usuario.nombre); // Autocompletado perfecto
```
## Tipos básicos en TypeScript
TypeScript ofrece varios tipos primitivos:
- **string**: Cadenas de texto
- **number**: Números (enteros y decimales)
- **boolean**: Valores true/false
- **array**: Listas de elementos
- **object**: Objetos JavaScript
- **any**: Cualquier tipo (evitar su uso)
- **unknown**: Tipo desconocido (más seguro que any)
- **void**: Ausencia de valor
- **null** y **undefined**: Valores nulos
```typescript
let nombre: string = "María";
let edad: number = 28;
let esActivo: boolean = true;
let hobbies: string[] = ["programar", "leer", "correr"];
let puntuaciones: Array = [95, 87, 92];
```
## Interfaces: El corazón de TypeScript
Las interfaces definen la estructura de los objetos y son fundamentales para escribir código mantenible:
```typescript
interface Producto {
id: number;
nombre: string;
precio: number;
descripcion?: string; // Propiedad opcional
readonly sku: string; // Solo lectura
}
interface CarritoCompras {
productos: Producto[];
total: number;
aplicarDescuento(porcentaje: number): number;
}
```
## Primeros pasos
Para comenzar con TypeScript en tu proyecto:
1. **Instala TypeScript**:
```bash
npm install -D typescript
```
2. **Inicializa la configuración**:
```bash
npx tsc --init
```
3. **Configura tu tsconfig.json** según tus necesidades
4. **Comienza a escribir archivos .ts** en lugar de .js
## Conclusión
TypeScript representa una evolución natural para cualquier desarrollador JavaScript que busque escribir código más robusto y mantenible. La curva de aprendizaje es suave, especialmente si ya conoces JavaScript, y los beneficios superan con creces el esfuerzo inicial.
¿Ya has probado TypeScript en tus proyectos? ¡Comparte tu experiencia en los comentarios!