Generics en JavaScript: para qué sirven y cómo usarlos

Generics en JavaScript: para qué sirven y cómo usarlos

El desarrollo moderno con JavaScript y Node.js no solo requiere escribir código rápidamente, sino también garantizar su fiabilidad. Una de las herramientas clave que proporcionan flexibilidad y seguridad de tipos son los Generics. En este artículo analizaremos qué son los generics, para qué se necesitan en el ecosistema de JavaScript y cómo aplicarlos eficazmente en la práctica. El material será útil tanto para principiantes como para desarrolladores experimentados que deseen profundizar sus conocimientos.

¿Qué son los Generics y para qué sirven?

Los Generics (tipos genéricos) son un mecanismo que permite crear componentes (funciones, clases, interfaces) que trabajan con diferentes tipos de datos, manteniendo al mismo tiempo una tipificación estricta. A diferencia de JavaScript común, que es dinámicamente tipado, los generics provienen del mundo de TypeScript, una extensión de JS que añade tipificación estática.

¿Para qué sirve esto? Imagine que escribe una función que devuelve el primer elemento de un array. Sin generics, tendría que usar el tipo any, lo que le priva de las sugerencias del IDE y aumenta el riesgo de errores. Con Generics, puede escribir código universal que funcione de forma segura con números, cadenas, objetos y cualquier otro tipo.

// Sin generics (peligroso)function getFirst(arr: any[]): any {  return arr[0];}

// Con generics (seguro)function getFirst<T>(arr: T[]): T | undefined {  return arr[0];}

const num = getFirst([1, 2, 3]); // tipo numberconst str = getFirst(['a', 'b']); // tipo string

De esta manera, los generics hacen que el código sea más reutilizable y seguro en cuanto a tipos, lo que es especialmente importante en proyectos grandes con Node.js.

Cómo usar Generics en TypeScript (JavaScript con tipos)

Aunque JavaScript puro no soporta generics, TypeScript se integra completamente con el ecosistema de Node.js. Veamos los escenarios de uso principales.

1. Funciones genéricas

La forma más sencilla es parametrizar una función con uno o varios tipos. Esto es útil para utilidades que trabajan con colecciones.

// Función para combinar dos arraysfunction mergeArrays<T>(arr1: T[], arr2: T[]): T[] {  return [...arr1, ...arr2];}

const numbers = mergeArrays([1, 2], [3, 4]); // number[]const strings = mergeArrays(['hola'], ['mundo']); // string[]

Aquí, <T> es un parámetro de tipo que se sustituye automáticamente al llamar a la función. También puede especificar el tipo explícitamente:

const mixed = mergeArrays<number | string>([1], ['a']); // (number | string)[]

2. Clases genéricas

Los generics son ideales para crear estructuras de datos como pilas, colas o cachés.

class Stack<T> {  private items: T[] = [];

  push(item: T): void {    this.items.push(item);  }

  pop(): T | undefined {    return this.items.pop();  }

  peek(): T | undefined {    return this.items[this.items.length - 1];  }}

// Usoconst numberStack = new Stack<number>();numberStack.push(10);numberStack.push(20);console.log(numberStack.pop()); // 20

const stringStack = new Stack<string>();stringStack.push('TypeScript');console.log(stringStack.peek()); // 'TypeScript'

3. Restricciones de tipos (Constraints)

A veces es necesario restringir el genérico a un conjunto específico de tipos. Por ejemplo, garantizar que un objeto tenga la propiedad length.

// Restringimos T a tipos que tengan lengthfunction logLength<T extends { length: number }>(item: T): void {  console.log(`Longitud: ${item.length}`);}

logLength('Hola'); // 5logLength([1, 2, 3]); // 3// logLength(123); // Error: number no tiene length

La palabra clave exten