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

Introducción: ¿Por qué necesitas Generics en JavaScript?

Cada desarrollador de JavaScript tarde o temprano se encuentra con una situación en la que una función o clase debe trabajar con diferentes tipos de datos. Sin herramientas especiales, hay que duplicar código o usar any, lo que nos priva del control de tipos. Los Generics (genéricos o tipos genéricos) resuelven este problema.

En el contexto de JavaScript, los genéricos son especialmente relevantes al trabajar con TypeScript o al usar patrones modernos en Node.js. Incluso si escribes en JavaScript puro, comprender el concepto de Generics te ayudará a escribir código más flexible y seguro.

En este artículo analizaremos:

• Qué son los Generics y para qué sirven
• Cómo usar genéricos en funciones y clases
• Ejemplos prácticos para Node.js
• Errores comunes de principiantes

¿Qué son los Generics (genéricos) en JavaScript?

Los Generics son una forma de crear componentes (funciones, clases, interfaces) que pueden trabajar con diferentes tipos de datos, manteniendo la seguridad de tipos. En lugar de escribir una función separada para números, otra para cadenas y otra para objetos, escribes una única función universal.

Imagina que creas una caja. Una caja normal solo puede almacenar un tipo de objetos. Los genéricos son una caja "inteligente" que se adapta a lo que pones dentro, pero recuerda exactamente qué hay allí.

En TypeScript (una extensión de JavaScript), los genéricos se indican con corchetes angulares <> y la letra T (de Type) u otros identificadores:

// Ejemplo simple de genérico en TypeScriptfunction identity<T>(arg: T): T {    return arg;}

// Ahora la función funciona con cualquier tipoconst num = identity<number>(42);    // tipo numberconst str = identity<string>("Hola"); // tipo string

En JavaScript puro esta sintaxis no está disponible, pero el concepto sigue siendo útil para entender la arquitectura de aplicaciones.

¿Para qué sirven los Generics en JavaScript y Node.js?

Consideremos tres razones clave por las que vale la pena entender los genéricos.

1. Seguridad de tipos sin perder flexibilidad

Sin genéricos, a menudo usas any, lo que desactiva la verificación de tipos:

// Mal: perdemos información del tipofunction getFirstElement(arr: any[]): any {    return arr[0];}

const val = getFirstElement([1, 2, 3]);// val tiene tipo any, no sabemos si es número o cadena

Con genéricos, el tipo se conserva:

// Bien: el tipo se conservafunction getFirstElement<T>(arr: T[]): T {    return arr[0];}

const val = getFirstElement([1, 2, 3]); // val: numberconst str = getFirstElement(["a", "b"]); // str: string

2. Reducción de duplicación de código

Sin genéricos, tendrías que escribir funciones separadas para cada tipo:

// Sin genéricos — duplicaciónfunction processNumber(num: number): number { /* ... */ }function processString(str: string): string { /* ... */ }function processObject(obj: object): object { /* ... */ }

// Con genéricos — una sola funciónfunction process<T>(data: T): T { /* ... */ }

3. Creación de componentes reutilizables

En Node.js, los genéricos se usan a menudo para crear utilidades universales, manejadores de datos y clientes API:

// Cliente HTTP universal con genéricosasync function fetchData<T>(url: string): Promise<T> {    const response = await fetch(url);    return response.json() as Promise<T>;}

// Usointerface User {    id: number;    name: string;}

const user = await fetchData<User>('/api/user/1');// user automáticamente tiene tipo User

Cómo usar Generics: prácticos