Certificado de TypeScript Sintaxis Básica

TypeScript se ha convertido en una herramienta esencial para el desarrollo de aplicaciones modernas, ofreciendo todas las ventajas de JavaScript con el añadido de un sistema de tipos estático. Este lenguaje, desarrollado y mantenido por Microsoft, extiende JavaScript permitiendo detectar errores durante la fase de desarrollo en lugar de en tiempo de ejecución, lo que resulta en código más robusto y mantenible.

¿Qué es TypeScript?

TypeScript es un superconjunto de JavaScript que añade tipado estático opcional y otras características avanzadas al lenguaje. Todo código JavaScript válido es también código TypeScript válido, pero TypeScript añade capacidades adicionales que mejoran significativamente la experiencia de desarrollo:

• Comprobación de tipos en tiempo de compilación
• Autocompletado inteligente en editores de código
• Refactorización más segura
• Documentación integrada a través de los tipos

El código TypeScript se transpila a JavaScript estándar, lo que significa que puede ejecutarse en cualquier entorno donde JavaScript funcione: navegadores, Node.js, Deno, o cualquier otro runtime de JavaScript.

Ventajas de utilizar TypeScript

La adopción de TypeScript ofrece múltiples beneficios para proyectos de cualquier tamaño:

• Detección temprana de errores: Identifica problemas potenciales antes de ejecutar el código
• Mejor documentación: Los tipos sirven como documentación viva del código
• Desarrollo más eficiente: El autocompletado y las sugerencias del IDE mejoran la productividad
• Mantenimiento simplificado: Facilita trabajar con bases de código grandes y complejas
• Integración con herramientas modernas: Excelente soporte en editores como VS Code

Sistema de tipos

El sistema de tipos de TypeScript es uno de sus pilares fundamentales. A diferencia de JavaScript, que utiliza tipado dinámico, TypeScript permite definir explícitamente los tipos de datos que utilizarán nuestras variables, parámetros y valores de retorno:

// Variable con tipo explícito
let contador: number = 0;

// Función con parámetros tipados y tipo de retorno
function sumar(a: number, b: number): number {
    return a + b;
}

TypeScript incluye tipos primitivos como string, number, boolean, así como tipos más complejos como array, tuple, enum, any, unknown, void y muchos más que exploraremos en este curso.

Configuración del entorno de desarrollo

Para comenzar a trabajar con TypeScript, necesitarás configurar un entorno de desarrollo adecuado. Esto implica:

1. Instalar Node.js y npm (Node Package Manager)
2. Instalar TypeScript globalmente o como dependencia del proyecto
3. Configurar un archivo tsconfig.json para personalizar el comportamiento del compilador
4. Integrar TypeScript con tu editor de código favorito

La configuración básica es sencilla, pero TypeScript ofrece numerosas opciones de personalización para adaptarse a las necesidades específicas de cada proyecto.

Sintaxis básica y estructuras de control

TypeScript mantiene la misma sintaxis básica de JavaScript para estructuras de control como condicionales y bucles, pero añadiendo la capacidad de trabajar con tipos:

// Condicionales con comprobación de tipos
function procesar(valor: string | number): void {
    if (typeof valor === "string") {
        // TypeScript sabe que aquí 'valor' es de tipo string
        console.log(valor.toUpperCase());
    } else {
        // TypeScript sabe que aquí 'valor' es de tipo number
        console.log(valor.toFixed(2));
    }
}

Los bucles y estructuras de control funcionan exactamente igual que en JavaScript, pero con la ventaja de la comprobación de tipos:

// Array tipado
const numeros: number[] = [1, 2, 3, 4, 5];

// For tradicional
for (let i = 0; i < numeros.length; i++) {
    console.log(numeros[i]);
}

// For...of
for (const num of numeros) {
    console.log(num);
}

// ForEach con función flecha
numeros.forEach((num: number) => {
    console.log(num);
});

Funciones en TypeScript

Las funciones en TypeScript añaden la capacidad de definir tipos para parámetros y valores de retorno, lo que mejora significativamente la claridad y seguridad del código:

// Función con parámetros tipados y tipo de retorno
function multiplicar(a: number, b: number): number {
    return a * b;
}

// Función flecha con tipos
const dividir = (a: number, b: number): number => a / b;

// Parámetros opcionales
function saludar(nombre: string, apellido?: string): string {
    return apellido ? `Hola, ${nombre} ${apellido}` : `Hola, ${nombre}`;
}

// Parámetros por defecto
function configurar(opciones: { color?: string, tamaño?: number } = {}): void {
    const color = opciones.color || "blanco";
    const tamaño = opciones.tamaño || 100;
    console.log(`Color: ${color}, Tamaño: ${tamaño}`);
}

Tipos avanzados

TypeScript ofrece mecanismos avanzados para trabajar con tipos, como:

• Enumeraciones (Enums): Conjuntos de constantes nombradas

enum DiaSemana {
    Lunes,
    Martes,
    Miercoles,
    Jueves,
    Viernes,
    Sabado,
    Domingo
}

let dia: DiaSemana = DiaSemana.Miercoles;
console.log(dia); // Imprime: 2

• Alias de tipos: Crear nombres personalizados para tipos complejos

// Definición de un alias de tipo
type Coordenada = {
    x: number;
    y: number;
};

// Uso del alias
function moverPunto(punto: Coordenada, deltaX: number, deltaY: number): Coordenada {
    return {
        x: punto.x + deltaX,
        y: punto.y + deltaY
    };
}

• Aserciones de tipo: Indicar al compilador que trate un valor como un tipo específico

// Aserción de tipo usando "as"
const canvas = document.getElementById('miCanvas') as HTMLCanvasElement;

// Aserción de tipo usando sintaxis de ángulos (menos común)
const ctx = (<HTMLCanvasElement>canvas).getContext('2d');

Integración con JavaScript existente

Una de las grandes ventajas de TypeScript es su capacidad para integrarse gradualmente con proyectos JavaScript existentes. Puedes:

• Añadir archivos .ts a un proyecto JavaScript sin modificar los archivos .js existentes
• Utilizar archivos de declaración (.d.ts) para proporcionar información de tipos a código JavaScript
• Configurar diferentes niveles de estrictez en la comprobación de tipos

Esta flexibilidad permite adoptar TypeScript de forma progresiva, obteniendo beneficios inmediatos sin necesidad de reescribir todo el código existente.

Aplicaciones prácticas

TypeScript se utiliza ampliamente en el desarrollo web moderno, especialmente en:

• Frameworks frontend como Angular, React y Vue.js
• Desarrollo backend con Node.js
• Aplicaciones móviles híbridas con frameworks como Ionic
• Desarrollo de juegos con frameworks como Phaser
• Herramientas de línea de comandos y utilidades

Su versatilidad y las ventajas que ofrece lo han convertido en una tecnología fundamental para desarrolladores que buscan crear aplicaciones robustas y mantenibles.

Herramientas del ecosistema

El ecosistema de TypeScript incluye numerosas herramientas y utilidades que mejoran la experiencia de desarrollo:

• TSLint/ESLint: Herramientas de análisis estático para mantener la calidad del código
• ts-node: Ejecutar TypeScript directamente sin necesidad de compilación previa
• TypeScript Playground: Entorno online para experimentar con TypeScript
• Definiciones de tipos DefinitelyTyped: Repositorio comunitario con tipos para miles de bibliotecas JavaScript

Estas herramientas, junto con el excelente soporte en editores como Visual Studio Code, crean un entorno de desarrollo potente y productivo.

Evolución y futuro

TypeScript se mantiene en constante evolución, con nuevas características y mejoras en cada versión. El equipo de desarrollo sigue un enfoque cuidadoso, asegurando la compatibilidad con versiones anteriores mientras introduce nuevas funcionalidades que mejoran la experiencia de desarrollo.

La comunidad alrededor de TypeScript continúa creciendo, y su adopción en proyectos de todos los tamaños demuestra su valor como herramienta para el desarrollo de software moderno.

A lo largo de este curso, exploraremos en profundidad todos estos conceptos, desde los fundamentos básicos hasta características más avanzadas, proporcionando una base sólida para desarrollar aplicaciones robustas con TypeScript.