Cómo crear y utilizar módulos TypeScript
Los módulos TypeScript ofrecen un enfoque estructurado para organizar y administrar el código. Los módulos permiten encapsular el código en archivos separados, lo que mejora la capacidad de mantenimiento, reutilización y prueba. Esta guía explica el proceso de creación y uso de módulos TypeScript.
¿Qué son los módulos TypeScript?
Los módulos de TypeScript son archivos individuales que exportan e importan elementos de código, como clases, funciones y variables. Al utilizar módulos, el código se puede dividir en partes manejables, lo que facilita un mejor control de las interacciones entre las diferentes partes del código.
Creación de un módulo TypeScript
Para crear un módulo TypeScript, se deben seguir los siguientes pasos:
- Cree un archivo TypeScript: Comience creando un nuevo archivo `.ts` para el módulo, como `mathUtils.ts`.
- Defina y exporte el código: Implemente funciones, clases o variables dentro de este archivo y use la palabra clave
export
para que estén disponibles para otros módulos.
Ejemplo de un módulo simple:
// mathUtils.ts
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
En este ejemplo, las funciones `add` y `subtract` se definen y exportan desde el módulo `mathUtils.ts`.
Importación y uso de un módulo TypeScript
Para utilizar el código de un módulo TypeScript en otro archivo, es necesario importarlo. Esto implica:
- Crea un nuevo archivo TypeScript: Genera un archivo donde se utilizará el código del módulo, como `app.ts`.
- Importar el módulo: Emplee la palabra clave
import
para importar funciones, clases o variables del módulo.
Ejemplo de importación y uso de las funciones `add` y `subtract`:
// app.ts
import { add, subtract } from './mathUtils';
const sum = add(5, 3);
const difference = subtract(5, 3);
console.log(`Sum: ${sum}`);
console.log(`Difference: ${difference}`);
En este ejemplo, las funciones `add` y `subtract` se importan desde el módulo `mathUtils` y se utilizan dentro del archivo `app.ts`.
Exportaciones predeterminadas y con nombre
Los módulos TypeScript admiten exportaciones predeterminadas y con nombre. A continuación, se incluye una breve descripción general:
- Exportaciones predeterminadas: Se puede exportar un único valor como exportación predeterminada desde un módulo usando
export default
. - Exportaciones con nombre: Se pueden exportar varios valores desde un módulo utilizando exportaciones con nombre con la palabra clave
export
.
Ejemplo que demuestra ambos tipos de exportaciones:
// shapes.ts
export default class Circle {
constructor(public radius: number) {}
area(): number {
return Math.PI * this.radius ** 2;
}
}
export function getCircleInfo(radius: number): string {
const circle = new Circle(radius);
return `A circle with radius ${radius} has an area of ${circle.area()}`;
}
En este ejemplo, `Circle` se exporta como la exportación predeterminada, mientras que `getCircleInfo` es una exportación con nombre.
Cómo organizar módulos en un proyecto
En el caso de proyectos más grandes con numerosos módulos, la organización se vuelve crucial. Tenga en cuenta los siguientes consejos:
- Estructura de directorio: Agrupa módulos relacionados en directorios como `models/`, `services/` y `utils/`.
- Archivos de índice: Utilice archivos `index.ts` en directorios para agregar y reexportar módulos, simplificando las importaciones en todo el proyecto.
Ejemplo de estructura de directorio:
project/
│
├── src/
│ ├── models/
│ │ ├── index.ts
│ │ └── user.ts
│ └── app.ts
Conclusión
Los módulos TypeScript son una característica clave para organizar y administrar el código. Al crear y usar módulos, el código puede mantenerse modular, mantenible y escalable. Comprender cómo exportar e importar código, así como cómo estructurar un proyecto, mejora la eficacia del desarrollo TypeScript.