TypeScript 类型进阶：从泛型约束到类型体操的工程边界

function bad<T>(item: T): T {
  return item.name;  // 编译错误：T 上不存在 name
}

interface HasId {
  id: string;
}

function findById<T extends HasId>(list: T[], id: string): T | undefined {
  return list.find((item) => item.id === id);
}

function pick<T, K extends keyof T>(obj: T, keys: K[]): Pick<T, K> {
  const result = {} as Pick<T, K>;
  for (const key of keys) {
    result[key] = obj[key];
  }
  return result;
}

const user = { id: 1, name: "a", email: "a@x.com" };
const slim = pick(user, ["id", "name"]);  // 类型是 { id: number; name: string }
// pick(user, ["nickname"]);              // 编译错误：nickname 不在 keyof 范围内

function createPair<A, B extends string>(first: A, second: B): [A, B] {
  return [first, second];
}

const pair = createPair(42, "debug");   // [number, "debug"]，无需显式写 <number, string>

type IsString<T> = T extends string ? true : false;

type A = IsString<"x">;   // true
type B = IsString<42>;    // false

type MyReturnType<T> = T extends (...args: never[]) => infer R ? R : never;

function loadConfig() {
  return { host: "localhost", port: 8080 };
}

type Config = MyReturnType<typeof loadConfig>;
// { host: string; port: number } —— 从函数实现处自动同步，改函数不用改类型

type AwaitedValue<T> = T extends Promise<infer V> ? AwaitedValue<V> : T;

type D1 = AwaitedValue<Promise<Promise<number>>>;   // number，递归解包

type ToArray<T> = T extends any ? T[] : never;

type R = ToArray<string | number>;   // string[] | number[]，而不是 (string | number)[]
// 想禁止分发，用数组包一层：[T] extends [any] ? T[] : never

interface Events {
  click: { x: number; y: number };
  focus: undefined;
  submit: { value: string };
}

type EventName = keyof Events;   // "click" | "focus" | "submit"

type HandlerName = `on${Capitalize<EventName>}`;
// "onClick" | "onFocus" | "onSubmit" —— 手写这三种之一必然一致

type Nullable<T> = {
  [K in keyof T]: T[K] | null;
};

interface Point { x: number; y: number }
type MaybePoint = Nullable<Point>;   // { x: number | null; y: number | null }

type Getters<T> = {
  [K in keyof T as `get${Capitalize<K & string>}`]: () => T[K];
};

interface Person { name: string; age: number }

type PersonGetters = Getters<Person>;
// { getName: () => string; getAge: () => number }

type OmitByType<T, U> = {
  [K in keyof T as T[K] extends U ? never : K]: T[K];
};

type OnlyStrings = OmitByType<{ a: string; b: number; c: boolean }, boolean>;
// { a: string; b: number } —— c 被过滤

type RequestState =
  | { status: "idle" }
  | { status: "loading" }
  | { status: "success"; data: string[] }
  | { status: "error"; message: string };

function render(state: RequestState): string {
  switch (state.status) {
    case "success":
      return state.data.join(",");   // 这里知道 data 一定存在
    case "error":
      return state.message;           // 这里知道 message 一定存在
    default:
      return "等待中";
  }
}

interface Fish { swim(): void }
interface Bird { fly(): void }

function isFish(pet: Fish | Bird): pet is Fish {
  return "swim" in pet;
}

function assertDefined<T>(value: T | undefined, label: string): asserts value is T {
  if (value === undefined) {
    throw new Error(`缺少必填字段: ${label}`);
  }
}

function parseEnv(raw: string): { port: number } {
  const obj: unknown = JSON.parse(raw);
  if (
    typeof obj === "object" && obj !== null &&
    "port" in obj && typeof (obj as { port: unknown }).port === "number"
  ) {
    return { port: obj.port };
  }
  throw new Error("环境变量格式不合法");
}

// vue.d.ts —— 给组件实例补充一个自定义属性
import "vue";

declare module "vue" {
  interface ComponentCustomProperties {
    $analytics: { track(name: string): void };
  }
}