¿Qué es?

Los Generics en TypeScript son una manera flexible de escribir código que funciona con diferentes tipos de datos, manteniendo la seguridad de tipos. Con generics, puedes crear funciones, clases e interfaces que pueden ser parametrizadas con tipos específicos. Esto permite reutilizar código con diferentes tipos de datos, haciendo que tu código sea más genérico y flexible.

¿Cómo utilizarlo?

// Función que obtiene el primer elemento de un array genérico
function getFirstElement<T>(data: T[]): T | null {
  if (!data.length) {
    return null;
  }

  const [firstElement] = data;

  return firstElement;
}

• function getFirstElement<T>(data: T[]): T | null { ... } es una función llamada getFirstElement que utiliza un tipo genérico <T>. Esto significa que la función puede trabajar con cualquier tipo de datos, representado por T. Recibe un argumento data que es un array de elementos del tipo T. La función retorna un elemento del tipo T o null si el array está vacío.
• if (!data.length) { return null; } verifica si el array data está vacío. Si está vacío, la función retorna null, indicando que no hay primer elemento para retornar.
• const [firstElement] = data; desestructura el array data y asigna su primer elemento a una variable llamada firstElement.
• return firstElement; retorna el firstElement, que puede ser de cualquier tipo T, como el primer elemento del array.

Después de definir la función, el código crea dos arrays:

const stringArray: string[] = ['Lucas', 'Fernanda', 'Gabriel', 'Maria'];
const numberArray: number[] = [1, 2, 3, 4, 5, 6];

• stringArray es un array de cadenas y numberArray es un array de números.

Luego, se llama a la función getFirstElement dos veces, una con stringArray y otra con numberArray, especificando el tipo genérico T como string y number, respectivamente:

console.log(getFirstElement<string>(stringArray));
console.log(getFirstElement<number>(numberArray));

• La primera llamada getFirstElement<string>(stringArray) retorna el primer elemento del array de cadenas, que es "Lucas", y lo imprime en la consola.
• La segunda llamada getFirstElement<number>(numberArray) retorna el primer elemento del array de números, que es 1, y lo imprime en la consola.