Módulos en TypeScript
Este artículo explica los módulos en TypeScript.
YouTube Video
Módulos en TypeScript
Los módulos en TypeScript son una característica importante para mejorar la reutilización y el mantenimiento del código. Al igual que JavaScript, TypeScript también se basa en el sistema de módulos ECMAScript 2015 (ES6), pero una característica clave es la capacidad de aprovechar el sistema de tipos de TypeScript.
¿Qué son los módulos?
Un módulo es un sistema para agrupar código relacionado en una única unidad que puede ser importada y reutilizada en otros archivos. En TypeScript, se crea un ámbito por archivo para encapsular el código, evitando que afecte a otros archivos. Esto ayuda a evitar colisiones de código y facilita el mantenimiento.
Módulos internos y externos
- Módulos internos (espacios de nombres): Un método de definición de módulos utilizado en TypeScript 1.5 y versiones anteriores, ahora no recomendado. Ahora se trata como un 'espacio de nombres.'.
- Módulos externos: El estándar actual, basado en el sistema de módulos ES6. Esta sección explica principalmente los módulos externos.
Cómo exportar módulos
Al crear módulos, es necesario exportar para permitir el acceso desde el exterior. En TypeScript, puedes exportar valores, funciones, clases, etc., utilizando la palabra clave export. Principalmente hay dos tipos de exportaciones.
Exportaciones con nombre
Se utilizan para realizar múltiples exportaciones, permitiendo que el lado de importación seleccione y use elementos específicos.
1// mathUtils.ts
2export const pi: number = 3.14159;
3
4export function add(x: number, y: number): number {
5 return x + y;
6}
7
8export function subtract(x: number, y: number): number {
9 return x - y;
10}Exportaciones predeterminadas
Se utilizan cuando quieres que todo el módulo tenga una única exportación predeterminada. Las exportaciones predeterminadas se exportan sin un nombre, permitiendo que el lado de importación las reciba con cualquier nombre.
1// calculator.ts
2export default class Calculator {
3 add(x: number, y: number): number {
4 return x + y;
5 }
6
7 subtract(x: number, y: number): number {
8 return x - y;
9 }
10}Cómo importar módulos
Para usar módulos, importa valores, funciones, clases, etc. desde el módulo utilizando la palabra clave import.
Importaciones nombradas
Cuando importes elementos específicos de una exportación nombrada, usa llaves {}.
1// main.ts
2import { pi, add, subtract } from './mathUtils';
3
4console.log(`Value of pi: ${pi}`);
5console.log(`Addition: ${add(10, 5)}`);
6console.log(`Subtraction: ${subtract(10, 5)}`);Importaciones por defecto
Al importar una exportación por defecto, puedes recibirla con cualquier nombre.
1// main.ts
2import Calculator from './calculator';
3
4const calculator = new Calculator();
5console.log(`Addition: ${calculator.add(10, 5)}`);
6console.log(`Subtraction: ${calculator.subtract(10, 5)}`);Alias de importación
Para evitar conflictos de nombres o acortar nombres largos, puedes importar con un alias.
1// main.ts
2import { add as addition, subtract as subtraction } from './mathUtils';
3
4console.log(`Addition: ${addition(10, 5)}`);
5console.log(`Subtraction: ${subtraction(10, 5)}`);Diferencia entre módulos y espacios de nombres
Un espacio de nombres (namespace) es una estructura interna de módulo utilizada en las primeras versiones de TypeScript para agrupar código. Sin embargo, ahora se recomiendan los módulos ES6, y los espacios de nombres rara vez son necesarios.
Los espacios de nombres pueden definirse dentro del mismo archivo o en múltiples archivos, y dado que pueden expandirse globalmente, gestionar las dependencias puede volverse complicado. En contraste, los módulos tienen ámbitos separados por archivo y dependencias claras, lo que los hace un método más moderno y seguro.
1// Example of a namespace
2namespace Geometry {
3 export function calculateArea(radius: number): number {
4 return Math.PI * radius * radius;
5 }
6}
7
8// Can be used directly without importing the module (not recommended)
9const area: number = Geometry.calculateArea(5);
10console.log(`Area: ${area}`);Resolución de módulos en TypeScript
En TypeScript, existen dos estrategias para la resolución de módulos.
- Resolución de módulos de Node: El método estándar de resolución utilizado en entornos Node.js que resuelve módulos buscando dentro de la carpeta
node_modules. - Resolución clásica de módulos: El método propio de TypeScript que realiza una búsqueda más flexible, pero no se utiliza comúnmente hoy en día.
Normalmente, se usa la resolución de módulos de Node y está habilitada por defecto a menos que se especifique lo contrario en el archivo de configuración.
Ejemplo práctico
Finalmente, se muestra un ejemplo de implementación y reutilización de funciones computacionales utilizando módulos.
mathUtils.ts
1export const pi: number = 3.14159;
2
3export function multiply(x: number, y: number): number {
4 return x * y;
5}
6
7export function divide(x: number, y: number): number {
8 if (y === 0) {
9 throw new Error("Cannot divide by zero");
10 }
11 return x / y;
12}calculator.ts
1import { multiply, divide } from './mathUtils';
2
3export default class Calculator {
4 multiplyNumbers(x: number, y: number): number {
5 return multiply(x, y);
6 }
7
8 divideNumbers(x: number, y: number): number {
9 return divide(x, y);
10 }
11}main.ts
1import Calculator from './calculator';
2
3const calculator = new Calculator();
4
5const result1: number = calculator.multiplyNumbers(10, 5);
6console.log(`Multiplication: ${result1}`);
7
8const result2: number = calculator.divideNumbers(10, 2);
9console.log(`Division: ${result2}`);Resumen
El sistema de módulos de TypeScript es una herramienta poderosa para organizar el código, mejorar la reutilización y aumentar el mantenimiento. Se recomienda el uso de módulos externos basados en módulos ES6, y el uso de las palabras claves export e import permite una fácil exportación e importación de módulos.
Puedes seguir el artículo anterior utilizando Visual Studio Code en nuestro canal de YouTube. Por favor, también revisa nuestro canal de YouTube.