Aprender TypeScript Namespaces y Módulos

Namespaces y Módulos en TypeScript

La organización del código es fundamental en cualquier aplicación de software profesional. TypeScript ofrece dos mecanismos principales para estructurar y organizar el código: los namespaces y los módulos. Estos sistemas permiten agrupar funcionalidades relacionadas, evitar conflictos de nombres y crear arquitecturas escalables.

Namespaces: Organización Interna

Los namespaces proporcionan una forma de agrupar código relacionado bajo un nombre común, creando un contenedor lógico que evita la contaminación del espacio de nombres global. Esta característica resulta especialmente útil cuando trabajamos con bibliotecas internas o queremos organizar funcionalidades específicas.

namespace Geometria {
    export interface Punto {
        x: number;
        y: number;
    }
    
    export class Rectangulo {
        constructor(
            private ancho: number,
            private alto: number
        ) {}
        
        calcularArea(): number {
            return this.ancho * this.alto;
        }
    }
    
    export function distancia(p1: Punto, p2: Punto): number {
        return Math.sqrt(Math.pow(p2.x - p1.x, 2) + Math.pow(p2.y - p1.y, 2));
    }
}

Para utilizar elementos de un namespace, empleamos la notación de punto:

const punto1: Geometria.Punto = { x: 0, y: 0 };
const punto2: Geometria.Punto = { x: 3, y: 4 };

const rectangulo = new Geometria.Rectangulo(10, 5);
const area = rectangulo.calcularArea();
const distanciaEntrePuntos = Geometria.distancia(punto1, punto2);

Los namespaces pueden anidarse para crear jerarquías más complejas:

namespace Aplicacion {
    export namespace Utilidades {
        export function formatearFecha(fecha: Date): string {
            return fecha.toLocaleDateString('es-ES');
        }
        
        export namespace Validacion {
            export function esEmailValido(email: string): boolean {
                return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
            }
        }
    }
}

// Uso de namespaces anidados
const fechaFormateada = Aplicacion.Utilidades.formatearFecha(new Date());
const emailValido = Aplicacion.Utilidades.Validacion.esEmailValido("test@example.com");

Módulos: El Sistema Moderno

Los módulos representan el enfoque moderno y recomendado para organizar código en TypeScript. Cada archivo se considera un módulo independiente con su propio ámbito de variables, evitando conflictos globales y proporcionando un control granular sobre qué elementos se exponen.

Exportación de elementos desde un módulo:

// archivo: matematicas.ts
export interface Operacion {
    ejecutar(a: number, b: number): number;
}

export class Calculadora {
    sumar(a: number, b: number): number {
        return a + b;
    }
    
    multiplicar(a: number, b: number): number {
        return a * b;
    }
}

export const PI = 3.14159;

export function factorial(n: number): number {
    return n <= 1 ? 1 : n * factorial(n - 1);
}

// Exportación por defecto
export default class CalculadoraAvanzada extends Calculadora {
    potencia(base: number, exponente: number): number {
        return Math.pow(base, exponente);
    }
}

Importación de elementos en otro módulo:

// archivo: main.ts
import CalculadoraAvanzada, { Calculadora, PI, factorial } from './matematicas';
import { Operacion } from './matematicas';

const calc = new Calculadora();
const resultado = calc.sumar(5, 3);

const calcAvanzada = new CalculadoraAvanzada();
const potencia = calcAvanzada.potencia(2, 8);

console.log(`El valor de PI es: ${PI}`);
console.log(`Factorial de 5: ${factorial(5)}`);

Patrones de Importación y Exportación

TypeScript ofrece múltiples patrones de importación para diferentes necesidades:

Importación con alias:

import { Calculadora as Calc, PI as ConstantePi } from './matematicas';

const miCalculadora = new Calc();
console.log(`Valor de pi: ${ConstantePi}`);

Importación de todo el módulo:

import * as Mat from './matematicas';

const calc = new Mat.Calculadora();
const resultado = Mat.factorial(6);

Importación dinámica para carga bajo demanda:

async function cargarModulo() {
    const modulo = await import('./matematicas');
    const calc = new modulo.Calculadora();
    return calc.sumar(10, 20);
}

Re-exportación y Módulos Barrel

Los módulos barrel permiten crear puntos de entrada centralizados que simplifican las importaciones:

// archivo: index.ts (barrel module)
export { Calculadora, PI, factorial } from './matematicas';
export { Geometria } from './geometria';
export { Utilidades } from './utilidades';

// Ahora podemos importar desde un solo lugar
import { Calculadora, Geometria, Utilidades } from './mi-biblioteca';

La re-exportación selectiva ofrece control sobre qué elementos exponer:

// Exportar solo elementos específicos
export { Calculadora, PI } from './matematicas';
// No exportamos factorial para mantenerlo interno

Resolución de Módulos

TypeScript utiliza diferentes estrategias de resolución para localizar módulos. La resolución relativa busca archivos en rutas específicas:

// Importaciones relativas
import { MiClase } from './modulos/mi-clase';
import { Utilidad } from '../utilidades/helper';

La resolución no relativa busca en node_modules y rutas configuradas:

// Importaciones de bibliotecas externas
import * as lodash from 'lodash';
import { Component } from '@angular/core';

Los módulos de declaración permiten trabajar con bibliotecas JavaScript existentes:

// archivo: tipos.d.ts
declare module 'mi-biblioteca-js' {
    export function procesarDatos(datos: any[]): string;
    export interface ConfiguracionBiblioteca {
        timeout: number;
        retries: number;
    }
}

Esta organización modular facilita el mantenimiento del código, mejora la reutilización y permite crear aplicaciones escalables con una arquitectura clara y bien estructurada.