Что такое дженерики (generics) в TypeScript и зачем они нужны?

// Without generics the type is lost:
// function firstElement(arr: any[]): any  ->  the output is any

// With generics, the input -> output relationship is preserved
function firstElement<T>(arr: T[]): T | undefined {
  return arr[0];
}

const num = firstElement([10, 20, 30]);      // number | undefined
const word = firstElement(["a", "b", "c"]);  // string | undefined
// num.toUpperCase();
// Error: Property 'toUpperCase' does not exist on type 'number'.

// Constraint with extends: T must have a length
function longest<T extends { length: number }>(a: T, b: T): T {
  return a.length >= b.length ? a : b;
}

longest("hello", "goodbye");  // works: string has length
longest([1, 2], [1, 2, 3]);   // works: arrays have length
// longest(10, 20);
// Error: Argument of type 'number' is not assignable to parameter of type '{ length: number; }'.

// K extends keyof T: only accepts real keys of the object
function getProperty<T, K extends keyof T>(object: T, key: K): T[K] {
  return object[key];
}

const user = { name: "Ana", age: 30 };
const name = getProperty(user, "name"); // string
const age = getProperty(user, "age");   // number
// getProperty(user, "email");
// Error: Argument of type '"email"' is not assignable to parameter of type '"name" | "age"'.

// Compiles, but the output loses its type
function firstBad(arr: any[]): any {
  return arr[0];
}
const x = firstBad([1, 2, 3]);
x.toUpperCase(); // compiles and blows up at runtime: x is any

// Fix: the generic preserves the type
function firstGood<T>(arr: T[]): T | undefined {
  return arr[0];
}
const y = firstGood([1, 2, 3]); // number | undefined