Function Overloads in TypeScript

// Multiple call signatures
function process(input: string): string;
function process(input: number): number;
function process(input: boolean): boolean;

// Implementation signature (must handle all overloads)
function process(input: string | number | boolean): string | number | boolean {
  if (typeof input === "string") return input.toUpperCase();
  if (typeof input === "number") return input * 2;
  return !input;
}

function createElement(tag: "div"): HTMLDivElement;
function createElement(tag: "span"): HTMLSpanElement;
function createElement(tag: "input", options: { type: string }): HTMLInputElement;
function createElement(tag: string, options?: Record<string, unknown>): Element {
  const el = document.createElement(tag);
  if (options) Object.assign(el, options);
  return el;
}

// Prefer union types when possible
function pad(value: string, padding: number | string): string {
  if (typeof padding === "number") return " ".repeat(padding) + value;
  return padding + value;
}

// Use overloads when return types differ based on input shape
function getData(url: string): Promise<Response>;
function getData<T>(url: string, parser: (data: unknown) => T): Promise<T>;
function getData<T>(url: string, parser?: (data: unknown) => T) {
  return fetch(url).then(res => res.json()).then(data => parser ? parser(data) : data);
}