Что такое union type и что такое narrowing в TypeScript?

// Simple union + narrowing with typeof
function format(value: string | number): string {
  if (typeof value === "string") {
    return value.toUpperCase(); // here it's string
  }
  return value.toFixed(2);      // here it can only be number
}

// Discriminated union: the "kind" field is the discriminant
type Circle = { kind: "circle"; radius: number };
type Square = { kind: "square"; side: number };
type Shape = Circle | Square;

function area(shape: Shape): number {
  switch (shape.kind) {
    case "circle":
      return Math.PI * shape.radius ** 2; // TypeScript knows it's Circle
    case "square":
      return shape.side ** 2;             // here it's Square
    default: {
      // Exhaustiveness: if a shape is added and we don't handle it, this won't compile
      const nothing: never = shape;
      return nothing;
    }
  }
}

// Narrowing with "in" for objects without a discriminant
type Dog = { bark: () => void };
type Cat = { meow: () => void };

function makeSound(animal: Dog | Cat): void {
  if ("bark" in animal) animal.bark();
  else animal.meow();
}

function shout(value: string | number) {
  // return value.toUpperCase();
  // Error: Property 'toUpperCase' does not exist on type 'string | number'.

  // Fix: narrow first
  if (typeof value === "string") return value.toUpperCase();
  return String(value);
}