TypeScript 核心概念与类型系统

// 原始类型
let name: string = 'Alice';
let age: number = 25;
let isStudent: boolean = true;
let nothing: null = null;
let notDefined: undefined = undefined;
let unique: symbol = Symbol('unique');
let bigNumber: bigint = 100n;

// 对象类型
let person: object = { name: 'Alice', age: 25 };
let numbers: number[] = [1, 2, 3];
let strings: Array<string> = ['a', 'b', 'c'];
let fn: Function = () => {};

// 联合类型
let value: string | number = 'hello';
value = 42;

// 交叉类型
type Person = { name: string };
type Employee = { id: number };
type PersonEmployee = Person & Employee;

const personEmployee: PersonEmployee = {
  name: 'Alice',
  id: 1
};

// 字面量类型：值本身即类型
let direction: 'up' | 'down' | 'left' | 'right';
direction = 'up';    // OK
// direction = 'top'; // 错误：不在允许集合内

// 元组：固定长度、每个位置类型明确的数组
let pair: [string, number] = ['age', 25];
let rgb: [number, number, number] = [255, 128, 0];
// React 的 useState 返回值就是元组：[state, setState]

// 枚举：一组命名常量
enum Status {
  Pending,   // 0
  Active,    // 1
  Closed,    // 2
}
let s: Status = Status.Active;

// 字符串枚举（更利于调试，值有意义）
enum Role {
  Admin = 'ADMIN',
  User = 'USER',
  Guest = 'GUEST',
}

// 现代实践：常量对象 + as const 常被用来替代枚举
const LogLevel = {
  Debug: 'debug',
  Info: 'info',
  Error: 'error',
} as const;
type LogLevel = typeof LogLevel[keyof typeof LogLevel];
// 'debug' | 'info' | 'error'

// any：放弃类型检查，"逃生舱"，应尽量避免
let a: any = 4;
a.foo.bar;        // 不报错，但运行时可能崩溃
a = 'string';     // 随意赋值

// unknown：类型安全版的 any，用前必须收窄
let u: unknown = getValue();
// u.toFixed(2);   // 错误：不能直接使用
if (typeof u === 'number') {
  u.toFixed(2);    // OK：收窄后才能用
}

// void：表示函数没有返回值
function logMessage(msg: string): void {
  console.log(msg);
}

// never：永远不会有值（抛异常或死循环）
function throwError(msg: string): never {
  throw new Error(msg);
}
// never 也用于穷尽性检查（见下文类型守卫）

// 基于初始化值
let userName = 'Alice';  // 推断为 string
let count = 25;          // 推断为 number
let isActive = true;     // 推断为 boolean

// const 会推断为更窄的字面量类型
const literal = 'hello'; // 推断为 'hello'，而非 string

// 基于上下文（回调参数类型自动推断）
const numbers = [1, 2, 3];
numbers.forEach(num => {
  console.log(num.toFixed(2)); // num 被推断为 number
});

// 函数返回值推断
function add(a: number, b: number) {
  return a + b;   // 返回类型推断为 number
}

// 显式类型注解（先声明后赋值时需要）
let total: number;
total = 10;

// 使用 as 关键字
let value: unknown = 'hello';
let length: number = (value as string).length;

// 使用尖括号语法（在 JSX 中不推荐）
let length2: number = (<string>value).length;

// 非空断言：告诉编译器"这里一定不是 null/undefined"
function printName(name: string | null) {
  console.log(name!.toUpperCase()); // ! 断言 name 不为 null
}

// DOM 元素类型断言
const button = document.querySelector('button') as HTMLButtonElement;
button.addEventListener('click', () => {
  console.log('Button clicked');
});

// const 断言：把整个对象/数组冻结为最窄的只读字面量类型
const config = {
  endpoint: '/api',
  retries: 3,
} as const;
// config 的类型为 { readonly endpoint: '/api'; readonly retries: 3 }

// 基本接口
interface Person {
  name: string;
  age: number;
}

const person: Person = {
  name: 'Alice',
  age: 25
};

// 可选属性
interface Product {
  id: number;
  name: string;
  price?: number; // 可选属性
}

const product: Product = {
  id: 1,
  name: 'Laptop'
};

// 只读属性
interface Point {
  readonly x: number;
  readonly y: number;
}

const point: Point = { x: 10, y: 20 };
// point.x = 15; // 错误：只读属性不能修改

// 索引签名：允许任意字符串键
interface StringMap {
  [key: string]: string;
}
const headers: StringMap = { 'Content-Type': 'application/json' };

// 函数类型接口
interface SearchFn {
  (source: string, keyword: string): boolean;
}
const search: SearchFn = (src, kw) => src.includes(kw);

// 接口扩展
interface Animal {
  name: string;
}

interface Dog extends Animal {
  breed: string;
}

const dog: Dog = {
  name: 'Buddy',
  breed: 'Golden Retriever'
};

// 接口实现
interface Clock {
  currentTime: Date;
  setTime(d: Date): void;
}

class DigitalClock implements Clock {
  currentTime: Date = new Date();

  setTime(d: Date) {
    this.currentTime = d;
  }
}

// 声明合并：同名接口自动合并（常用于扩展第三方类型）
interface Window {
  myGlobalConfig: { debug: boolean };
}

// 基本类型别名
type Name = string;
type Age = number;
type Person = {
  name: Name;
  age: Age;
};

// 联合类型别名
type Status = 'pending' | 'success' | 'error';
type ID = string | number;

// 可辨识联合（Discriminated Union）：最强大的建模工具
type Shape =
  | { kind: 'circle'; radius: number }
  | { kind: 'rectangle'; width: number; height: number }
  | { kind: 'triangle'; base: number; height: number };

function area(shape: Shape): number {
  switch (shape.kind) {
    case 'circle':
      return Math.PI * shape.radius ** 2;
    case 'rectangle':
      return shape.width * shape.height;
    case 'triangle':
      return (shape.base * shape.height) / 2;
  }
}

// 函数类型别名
type Callback = (error: Error | null, data?: any) => void;

function fetchData(callback: Callback) {
  // ...
}

// 泛型类型别名
type Container<T> = { value: T };
type NumberContainer = Container<number>;

// 条件类型别名
type NonNullableType<T> = T extends null | undefined ? never : T;
type Result = NonNullableType<string | null>; // string

// 基本泛型函数
function identity<T>(arg: T): T {
  return arg;
}

const num = identity<number>(42);
const str = identity('hello'); // 类型推断为 string

// 多个类型参数
function pair<T, U>(first: T, second: U): [T, U] {
  return [first, second];
}

const pairResult = pair('hello', 42); // [string, number]

// 泛型约束：限制类型参数必须满足某种结构
interface Lengthwise {
  length: number;
}

function getLength<T extends Lengthwise>(arg: T): number {
  return arg.length;
}

getLength('hello');   // 5
getLength([1, 2, 3]); // 3
// getLength(42);     // 错误：number 没有 length 属性

// 用 keyof 约束键，实现类型安全的属性访问
function getProp<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}
const user = { id: 1, name: 'Alice' };
const id = getProp(user, 'id');     // 类型为 number
const name = getProp(user, 'name'); // 类型为 string
// getProp(user, 'email');          // 错误：'email' 不存在

// 泛型默认值
function createArray<T = string>(length: number, value: T): T[] {
  return Array(length).fill(value);
}

// 泛型接口
interface Box<T> {
  value: T;
}

const stringBox: Box<string> = { value: 'hello' };
const numberBox: Box<number> = { value: 42 };

// 泛型接口作为函数类型
interface Comparator<T> {
  (a: T, b: T): number;
}

const numberComparator: Comparator<number> = (a, b) => a - b;
const stringComparator: Comparator<string> = (a, b) =>
  a.localeCompare(b);

// 泛型接口作为类类型
interface Repository<T> {
  findById(id: number): T | null;
  save(entity: T): void;
}

interface User {
  id: number;
  name: string;
}

class UserRepository implements Repository<User> {
  private users: User[] = [];

  findById(id: number): User | null {
    return this.users.find(u => u.id === id) || null;
  }

  save(user: User): void {
    this.users.push(user);
  }
}

// 泛型接口描述通用 API 响应
interface ApiResponse<T> {
  code: number;
  message: string;
  data: T;
}
type UserResponse = ApiResponse<User>;
type UserListResponse = ApiResponse<User[]>;

// 泛型类
class Stack<T> {
  private items: T[] = [];

  push(item: T): void {
    this.items.push(item);
  }

  pop(): T | undefined {
    return this.items.pop();
  }

  peek(): T | undefined {
    return this.items[this.items.length - 1];
  }

  get size(): number {
    return this.items.length;
  }
}

const numberStack = new Stack<number>();
numberStack.push(1);
numberStack.push(2);
console.log(numberStack.pop()); // 2

const stringStack = new Stack<string>();
stringStack.push('hello');
stringStack.push('world');
console.log(stringStack.pop()); // 'world'

// 泛型 + 约束的类：类型安全的键值缓存
class Cache<K extends string | number, V> {
  private store = new Map<K, V>();

  set(key: K, value: V): void {
    this.store.set(key, value);
  }

  get(key: K): V | undefined {
    return this.store.get(key);
  }
}
const cache = new Cache<string, User>();
cache.set('u1', { id: 1, name: 'Alice' });

interface User {
  id: number;
  name: string;
  email: string;
  age: number;
}

// Partial<T>：将所有属性变为可选
type PartialUser = Partial<User>;
const partialUser: PartialUser = {
  name: 'Alice'
};

// 典型用途：更新函数只需传部分字段
function updateUser(id: number, changes: Partial<User>) {
  // 只更新传入的字段
}
updateUser(1, { age: 26 });

// Required<T>：将所有属性变为必需
type RequiredUser = Required<Partial<User>>;
const requiredUser: RequiredUser = {
  id: 1,
  name: 'Alice',
  email: 'alice@example.com',
  age: 25
};

// Readonly<T>：将所有属性变为只读
type ReadonlyUser = Readonly<User>;
const readonlyUser: ReadonlyUser = {
  id: 1,
  name: 'Alice',
  email: 'alice@example.com',
  age: 25
};
// readonlyUser.name = 'Bob'; // 错误

// Pick<T, K>：拣选属性
type UserBasicInfo = Pick<User, 'id' | 'name'>;
const basicInfo: UserBasicInfo = {
  id: 1,
  name: 'Alice'
};

// Omit<T, K>：排除属性（如返回给前端时去掉敏感字段）
type PublicUser = Omit<User, 'email'>;
const publicUser: PublicUser = {
  id: 1,
  name: 'Alice',
  age: 25
};

// Record<K, T>：创建键值对类型
type UserRecord = Record<number, User>;
const users: UserRecord = {
  1: { id: 1, name: 'Alice', email: 'alice@example.com', age: 25 },
  2: { id: 2, name: 'Bob', email: 'bob@example.com', age: 30 }
};

// 组合使用：常见的表单/DTO 建模
type CreateUserDTO = Omit<User, 'id'>;          // 创建时无 id
type UpdateUserDTO = Partial<Omit<User, 'id'>>; // 更新时字段全可选

// 1. typeof 守卫（原始类型）
function format(value: string | number): string {
  if (typeof value === 'number') {
    return value.toFixed(2); // 这里 value 是 number
  }
  return value.toUpperCase(); // 这里 value 是 string
}

// 2. instanceof 守卫（类实例）
function logError(err: Error | string) {
  if (err instanceof Error) {
    console.log(err.stack); // err 是 Error
  } else {
    console.log(err);       // err 是 string
  }
}

// 3. in 守卫（判断属性是否存在）
type Fish = { swim: () => void };
type Bird = { fly: () => void };
function move(animal: Fish | Bird) {
  if ('swim' in animal) {
    animal.swim(); // Fish
  } else {
    animal.fly();  // Bird
  }
}

// 4. 自定义类型守卫（is 关键字）
interface Cat { meow: () => void }
interface Dog { bark: () => void }
function isCat(pet: Cat | Dog): pet is Cat {
  return 'meow' in pet;
}
function speak(pet: Cat | Dog) {
  if (isCat(pet)) {
    pet.meow();
  } else {
    pet.bark();
  }
}

// 5. never 实现穷尽性检查
type Shape =
  | { kind: 'circle'; radius: number }
  | { kind: 'square'; side: number };

function area(shape: Shape): number {
  switch (shape.kind) {
    case 'circle': return Math.PI * shape.radius ** 2;
    case 'square': return shape.side ** 2;
    default:
      // 若将来新增 shape 却忘了处理，这里会编译报错
      const exhaustive: never = shape;
      return exhaustive;
  }
}

// 基本条件类型
type IsString<T> = T extends string ? true : false;

type Test1 = IsString<string>; // true
type Test2 = IsString<number>; // false

// 条件类型与联合类型（分布式）
type NonNullableType<T> = T extends null | undefined ? never : T;
type Test3 = NonNullableType<string | null>; // string

// infer 关键字：提取函数返回值类型
type MyReturnType<T> = T extends (...args: any[]) => infer R ? R : never;

function foo(): string {
  return 'hello';
}
type FooReturn = MyReturnType<typeof foo>; // string

// 提取数组元素类型
type ArrayElement<T> = T extends (infer U)[] ? U : never;
type NumberElement = ArrayElement<number[]>; // number

// 提取 Promise 的值类型
type PromiseValue<T> = T extends Promise<infer U> ? U : never;
type StringValue = PromiseValue<Promise<string>>; // string

// 基本映射类型
type MyReadonly<T> = {
  readonly [P in keyof T]: T[P];
};

type MyPartial<T> = {
  [P in keyof T]?: T[P];
};

interface User {
  name: string;
  age: number;
}

type ReadonlyUser = MyReadonly<User>;
type PartialUser = MyPartial<User>;

// 映射类型 + 键重映射：生成 getter
type Getters<T> = {
  [P in keyof T as `get${Capitalize<string & P>}`]: () => T[P];
};

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

// 映射类型 + 模板字面量类型：生成事件处理器
type EventHandlers<T> = {
  [K in keyof T as `on${Capitalize<string & K>}`]?: (event: T[K]) => void;
};

interface Events {
  click: MouseEvent;
  change: Event;
}

type EventHandlersType = EventHandlers<Events>;
// {
//   onClick?: (event: MouseEvent) => void;
//   onChange?: (event: Event) => void;
// }

// 基本模板字面量类型
type Greeting = `Hello, ${string}!`;
const greeting: Greeting = 'Hello, World!';

// 模板字面量类型 + 联合类型（笛卡尔积）
type Color = 'red' | 'green' | 'blue';
type Shade = 'light' | 'dark';
type ColorShade = `${Shade}-${Color}`;

const color1: ColorShade = 'light-red';
const color2: ColorShade = 'dark-blue';

// 事件名类型
type EventName<T extends string> = `on${Capitalize<T>}`;
type ClickEvent = EventName<'click'>; // 'onClick'

// 实际应用：CSS 自定义属性
type CSSVar<T extends string> = `--${T}`;
type PrimaryColorVar = CSSVar<'primary-color'>; // '--primary-color'

// utils.ts
// 命名导出
export function add(a: number, b: number): number {
  return a + b;
}

export function subtract(a: number, b: number): number {
  return a - b;
}

// 默认导出
export default function multiply(a: number, b: number): number {
  return a * b;
}

// 类型导出（推荐用 export type，编译时可被完全擦除）
export interface User {
  id: number;
  name: string;
}
export type ID = string | number;

// 重导出（聚合多个模块，常用于 index.ts）
export { add, subtract } from './math';
export * from './constants';
export type { Config } from './config';

// main.ts
// 命名导入
import { add, subtract } from './utils';

// 仅导入类型（type-only import，避免副作用、优化打包）
import type { User } from './utils';

// 默认导入
import multiply from './utils';

// 命名空间导入
import * as utils from './utils';
utils.add(1, 2);

// 混合导入
import multiply2, { add as sum } from './utils';

// 动态导入（按需加载，实现代码分割）
async function loadModule() {
  const utils = await import('./utils');
  console.log(utils.add(1, 2));
}

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "strict": true,              // 一键开启所有严格检查
    "noImplicitAny": true,       // 禁止隐式 any
    "strictNullChecks": true,    // null/undefined 必须显式处理
    "noUnusedLocals": true,      // 禁止未使用的变量
    "noImplicitReturns": true,   // 函数所有分支都要有返回
    "esModuleInterop": true,
    "skipLibCheck": true
  }
}

// 1. 用一份类型定义描述接口契约
interface UserDTO {
  id: number;
  userName: string;   // 注意：后端是 userName 而非 username
  createdAt: string;
}

// 2. 封装类型安全的请求函数
async function apiGet<T>(url: string): Promise<T> {
  const res = await fetch(url);
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return res.json() as Promise<T>;
}

// 3. 使用时自动获得字段提示与检查
const user = await apiGet<UserDTO>('/api/users/1');
console.log(user.userName);   // IDE 自动提示，拼错立刻报红
// console.log(user.username); // 编译错误，拼写错误被拦截

// let 宽化：类型变成 string
let a = 'up';            // 推断类型: string
// const 不宽化：类型是字面量 'up'
const b = 'up';          // 推断类型: 'up'

// 对象属性默认宽化
const config = { method: 'GET' };   // method 推断为 string
// 用 as const 冻结为字面量
const config2 = { method: 'GET' } as const; // method 为 'GET'，且整个对象 readonly

// 字面量联合：建模有限状态
type HttpMethod = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
function request(url: string, method: HttpMethod) {
  // method 只能是这 5 个值之一
}
request('/api', 'GET');   // OK
// request('/api', 'get'); // Error: 'get' 不能赋给 HttpMethod

// 数字字面量联合
type DiceRoll = 1 | 2 | 3 | 4 | 5 | 6;
// 布尔字面量（较少单独用）
type Truthy = true;

type Size = 'small' | 'medium' | 'large';
type Variant = 'primary' | 'secondary' | 'danger' | 'ghost';

interface ButtonProps {
  size: Size;
  variant: Variant;
  disabled?: boolean;
}

// 传错值立即报错，IDE 还会自动补全 3 个 size 选项
const props: ButtonProps = { size: 'medium', variant: 'primary' };

const opts = { method: 'GET' };
// request('/api', opts.method); // Error: string 不能赋给 HttpMethod
const opts2 = { method: 'GET' } as const;
request('/api', opts2.method);   // OK，method 为 'GET'

// 基础元组
let pair: [string, number] = ['age', 25];
// pair = [25, 'age']; // Error: 位置类型不匹配

// 具名元组（4.0+）：只是文档提示，不影响运行时
type Point = [x: number, y: number];
const p: Point = [10, 20];

// 可选元素
type Range = [start: number, end?: number];
const r1: Range = [0];
const r2: Range = [0, 100];

// 剩余元素
type StringThenNumbers = [string, ...number[]];
const s: StringThenNumbers = ['sum', 1, 2, 3, 4];

// 只读元组
type RO = readonly [number, number];
const ro: RO = [1, 2];
// ro[0] = 5; // Error: 只读

// 元组常见用法：模拟多返回值（类似 React useState）
function useToggle(init: boolean): [boolean, () => void] {
  let state = init;
  const toggle = () => { state = !state; };
  return [state, toggle];
}
const [on, toggleOn] = useToggle(false);

// 把两个元组拼起来
type Concat<T extends readonly unknown[], U extends readonly unknown[]> = [...T, ...U];
type R = Concat<[1, 2], [3, 4]>; // [1, 2, 3, 4]

// 提取首元素与剩余
type Head<T extends readonly unknown[]> = T extends [infer H, ...unknown[]] ? H : never;
type Tail<T extends readonly unknown[]> = T extends [unknown, ...infer Rest] ? Rest : [];
type H = Head<[1, 2, 3]>; // 1
type T2 = Tail<[1, 2, 3]>; // [2, 3]

// 数字枚举：默认从 0 递增
enum Direction {
  Up,     // 0
  Down,   // 1
  Left,   // 2
  Right,  // 3
}
// 可手动赋起始值，后续递增
enum StatusCode {
  OK = 200,
  NotFound = 404,
  ServerError = 500,
}

// 字符串枚举：无自增，每个都要赋值
enum LogLevel {
  Debug = 'DEBUG',
  Info = 'INFO',
  Warn = 'WARN',
  Error = 'ERROR',
}

// 上面的 Direction 编译成大致如下 JS：
var Direction;
(function (Direction) {
  Direction[Direction["Up"] = 0] = "Up";
  Direction[Direction["Down"] = 1] = "Down";
  Direction[Direction["Left"] = 2] = "Left";
  Direction[Direction["Right"] = 3] = "Right";
})(Direction || (Direction = {}));
// 结果：Direction.Up === 0，且 Direction[0] === 'Up'（反向映射）
// 字符串枚举只有正向映射，没有反向映射

const enum Color { Red, Green, Blue }
const c = Color.Green;
// 编译后直接内联为：const c = 1;（不生成 Color 对象）
// 优点：零运行时开销；缺点：无法反向映射、跨模块/isolatedModules 下有坑

// 用 as const 对象替代枚举，既有运行时值又有类型
const Direction = {
  Up: 'UP',
  Down: 'DOWN',
  Left: 'LEFT',
  Right: 'RIGHT',
} as const;
type Direction = typeof Direction[keyof typeof Direction]; // 'UP' | 'DOWN' | 'LEFT' | 'RIGHT'

function move(dir: Direction) { /* ... */ }
move(Direction.Up);   // OK
move('UP');           // 也 OK，因为就是字符串字面量

function parseAny(json: string): any {
  return JSON.parse(json);
}
const a = parseAny('{}');
a.foo.bar.baz;   // 不报错，运行时可能崩——any 的危险

function parseUnknown(json: string): unknown {
  return JSON.parse(json);
}
const u = parseUnknown('{}');
// u.foo;        // Error: 对象类型为 unknown
if (typeof u === 'object' && u !== null && 'foo' in u) {
  // 收窄后才能访问
}

// 返回 never 的函数
function fail(msg: string): never {
  throw new Error(msg);
}
function loop(): never {
  while (true) {}
}

// never 用于穷尽检查（exhaustive check）
type Shape =
  | { kind: 'circle'; r: number }
  | { kind: 'square'; size: number };

function area(s: Shape): number {
  switch (s.kind) {
    case 'circle': return Math.PI * s.r ** 2;
    case 'square': return s.size ** 2;
    default:
      // 若将来给 Shape 加了新成员却忘了处理，这里会编译报错
      const _exhaustive: never = s;
      return _exhaustive;
  }
}

type VoidFn = () => void;
const fn: VoidFn = () => 42; // OK！返回值被忽略
// 但你不能利用它的返回值
const r = fn(); // r 的类型是 void

// 实用场景：forEach 回调可以直接写 arr.push(x) 而不报错
[1, 2, 3].forEach(x => console.log(x));

// 同名 interface 自动合并
interface User {
  name: string;
}
interface User {
  age: number;
}
// 合并后 User = { name: string; age: number }
const u: User = { name: 'Alice', age: 25 };

// 经典用法：扩展全局 Window
declare global {
  interface Window {
    myAppConfig: { version: string };
  }
}
window.myAppConfig = { version: '1.0.0' };

// 扩展第三方库的类型（如给 Express Request 加字段）
// declare module 'express' {
//   interface Request { userId?: string; }
// }

// 1. 联合类型
type Result = { ok: true; data: string } | { ok: false; error: string };

// 2. 原始类型/元组别名
type ID = string | number;
type Pair = [number, number];

// 3. 映射类型
type Optional<T> = { [K in keyof T]?: T[K] };

// 4. 模板字面量类型
type EventName = `on${string}`;

// 5. 条件类型
type NonNull<T> = T extends null | undefined ? never : T;

// interface 用 extends（可多继承）
interface Animal { name: string; }
interface Pet extends Animal { owner: string; }
interface Dog extends Animal, Pet { breed: string; }

// type 用交叉 &
type Animal2 = { name: string };
type Pet2 = Animal2 & { owner: string };

// 互相扩展也可以
interface FromType extends Animal2 { extra: boolean; }
type FromInterface = Animal & { extra: boolean };

interface A { x: number }
// interface B extends A { x: string } // Error: 类型不兼容，立即暴露

type C = { x: number } & { x: string }; // x 变成 never，不报错但已损坏

interface StringMap {
  [key: string]: string;
}
const headers: StringMap = { 'Content-Type': 'application/json' };

// 数字索引签名（数组式）
interface NumberList {
  [index: number]: string;
}

// 混合：具体属性 + 索引签名（具体属性类型必须兼容索引类型）
interface Dict {
  length: number;              // OK
  [key: string]: number;       // 所有键都必须是 number
}

interface Config {
  readonly id: string;        // 只读，初始化后不可改
  name: string;               // 必填
  description?: string;       // 可选
  readonly tags?: string[];   // 只读且可选
}
const cfg: Config = { id: '1', name: 'app' };
// cfg.id = '2'; // Error: 只读属性
cfg.name = 'newName'; // OK

// 函数类型接口
interface Adder {
  (a: number, b: number): number;   // 调用签名
  version: string;                   // 函数也能带属性
}
const add: Adder = Object.assign(
  (a: number, b: number) => a + b,
  { version: '1.0' }
);

// 构造签名（描述可被 new 的类型）
interface PointCtor {
  new (x: number, y: number): { x: number; y: number };
}
function createPoint(Ctor: PointCtor, x: number, y: number) {
  return new Ctor(x, y);
}

// 重载签名
interface StringOrNumber {
  (value: string): string;
  (value: number): number;
}

class BankAccount {
  public owner: string;          // 默认 public，可省略
  private balance: number;       // 仅类内部可访问
  protected pin: string;         // 类及子类可访问
  readonly accountId: string;    // 只读

  constructor(owner: string, accountId: string, pin: string) {
    this.owner = owner;
    this.accountId = accountId;
    this.pin = pin;
    this.balance = 0;
  }

  deposit(amount: number) {
    this.balance += amount;      // OK：类内部
  }
  getBalance() { return this.balance; }
}

const acc = new BankAccount('Alice', 'A001', '1234');
acc.deposit(100);
// acc.balance;   // Error: private
// acc.accountId = 'x'; // Error: readonly

// 传统写法
class Point1 {
  x: number;
  y: number;
  constructor(x: number, y: number) {
    this.x = x;
    this.y = y;
  }
}

// 参数属性写法（等价，代码量减少约 60%）
class Point2 {
  constructor(
    public x: number,
    public y: number,
    private readonly label: string = 'point'
  ) {}
  describe() { return `${this.label}(${this.x}, ${this.y})`; }
}
const pt = new Point2(1, 2);

abstract class Shape {
  abstract area(): number;        // 抽象方法，子类必须实现
  abstract name: string;          // 抽象属性
  describe(): string {            // 具体方法，可被继承
    return `${this.name} 面积为 ${this.area()}`;
  }
}

class Circle extends Shape {
  name = 'circle';
  constructor(private r: number) { super(); }
  area(): number { return Math.PI * this.r ** 2; }
}
// new Shape(); // Error: 抽象类不能实例化
const c = new Circle(5);
console.log(c.describe());

// implements：类必须满足接口结构
interface Serializable {
  serialize(): string;
}
class User implements Serializable {
  constructor(public name: string) {}
  serialize() { return JSON.stringify({ name: this.name }); }
}

class Temperature {
  private _celsius = 0;

  // getter/setter：像属性一样访问，内部可加校验
  get celsius(): number { return this._celsius; }
  set celsius(value: number) {
    if (value < -273.15) throw new Error('低于绝对零度');
    this._celsius = value;
  }
  get fahrenheit(): number { return this._celsius * 9 / 5 + 32; }

  // 静态成员：属于类本身，不属于实例
  static readonly ABSOLUTE_ZERO = -273.15;
  static fromFahrenheit(f: number): Temperature {
    const t = new Temperature();
    t.celsius = (f - 32) * 5 / 9;
    return t;
  }
}
const t = new Temperature();
t.celsius = 25;              // 调用 setter
console.log(t.fahrenheit);  // 调用 getter
console.log(Temperature.ABSOLUTE_ZERO);

// ES 私有字段 #：运行时真私有
class Counter {
  #count = 0;                // 外部完全无法访问，连 as any 都不行
  increment() { this.#count++; }
  get value() { return this.#count; }
}
const counter = new Counter();
counter.increment();
// counter.#count; // 语法错误：私有字段只能在类内部访问

// 无约束：不能访问 .length，因为 T 可能是 number
// function longest<T>(a: T, b: T) { return a.length > b.length ? a : b; } // Error

// 加约束：T 必须有 length 属性
function longest<T extends { length: number }>(a: T, b: T): T {
  return a.length >= b.length ? a : b;
}
longest([1, 2], [1, 2, 3]);        // OK，返回 number[]
longest('ab', 'abc');              // OK，返回 string
// longest(1, 2);                  // Error: number 没有 length

// keyof 约束：K 必须是 T 的键
function getProp<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}
const person = { name: 'Alice', age: 25 };
const name = getProp(person, 'name');  // 类型精确为 string
const age = getProp(person, 'age');    // 类型精确为 number
// getProp(person, 'email');           // Error: 'email' 不是键

// 泛型默认值：不传时用默认类型
interface ApiResponse<T = unknown> {
  code: number;
  data: T;
  message: string;
}
const r1: ApiResponse = { code: 0, data: null, message: 'ok' };      // T = unknown
const r2: ApiResponse<string[]> = { code: 0, data: [], message: '' };// T = string[]

// 多个泛型参数，后者可引用前者
class Container<T, U = T[]> {
  constructor(public item: T, public list: U) {}
}

// 泛型函数：类型随参数流动
function identity<T>(x: T): T { return x; }
const n = identity(42);       // n: number（推断）
const s = identity<string>('hi'); // 显式指定

// 泛型数组工具
function first<T>(arr: T[]): T | undefined { return arr[0]; }
function map<T, U>(arr: T[], fn: (item: T, index: number) => U): U[] {
  const result: U[] = [];
  for (let i = 0; i < arr.length; i++) result.push(fn(arr[i], i));
  return result;
}
const lengths = map(['a', 'bb', 'ccc'], s => s.length); // number[]

// 泛型类：类型安全的栈
class Stack<T> {
  private items: T[] = [];
  push(item: T): void { this.items.push(item); }
  pop(): T | undefined { return this.items.pop(); }
  peek(): T | undefined { return this.items[this.items.length - 1]; }
  get size(): number { return this.items.length; }
}
const numStack = new Stack<number>();
numStack.push(1);
numStack.push(2);
const top = numStack.pop(); // number | undefined

// 基础条件类型
type IsString<T> = T extends string ? 'yes' : 'no';
type A = IsString<'hello'>;  // 'yes'
type B = IsString<42>;       // 'no'

// infer 捕获：提取数组元素类型
type ElementType<T> = T extends (infer E)[] ? E : never;
type E1 = ElementType<number[]>;   // number
type E2 = ElementType<string[]>;   // string

// infer 捕获函数返回值（ReturnType 的原理）
type MyReturnType<T> = T extends (...args: any[]) => infer R ? R : never;
type R1 = MyReturnType<() => number>;        // number
type R2 = MyReturnType<(x: string) => void>; // void

// infer 捕获 Promise 解包
type Unwrap<T> = T extends Promise<infer U> ? U : T;
type U1 = Unwrap<Promise<string>>; // string
type U2 = Unwrap<number>;          // number

// 嵌套 infer：提取第一个函数参数类型
type FirstArg<T> = T extends (first: infer F, ...rest: any[]) => any ? F : never;
type F1 = FirstArg<(name: string, age: number) => void>; // string

// 分布式：联合被逐个处理
type ToArray<T> = T extends any ? T[] : never;
type R = ToArray<string | number>; // string[] | number[]（分发了！）
// 计算过程：ToArray<string> | ToArray<number> = string[] | number[]

// 用 [T] 包裹可阻止分发
type ToArrayNonDist<T> = [T] extends [any] ? T[] : never;
type R2 = ToArrayNonDist<string | number>; // (string | number)[]

// 利用分发实现 Exclude
type MyExclude<T, U> = T extends U ? never : T;
type Without = MyExclude<'a' | 'b' | 'c', 'a'>; // 'b' | 'c'
// 过程：('a' extends 'a' ? never : 'a') | ('b' ...) | ('c' ...)
//     = never | 'b' | 'c' = 'b' | 'c'

// typeof 收窄（用于原始类型）
function format(value: string | number): string {
  if (typeof value === 'string') {
    return value.toUpperCase(); // 此处 value 收窄为 string
  }
  return value.toFixed(2);      // 此处 value 收窄为 number
}

// instanceof 收窄（用于类实例）
class Dog { bark() {} }
class Cat { meow() {} }
function speak(animal: Dog | Cat) {
  if (animal instanceof Dog) {
    animal.bark();  // 收窄为 Dog
  } else {
    animal.meow();  // 收窄为 Cat
  }
}

// in 收窄（按属性存在性）
type Fish = { swim: () => void };
type Bird = { fly: () => void };
function move(animal: Fish | Bird) {
  if ('swim' in animal) {
    animal.swim();  // 收窄为 Fish
  } else {
    animal.fly();   // 收窄为 Bird
  }
}

// 字面量与真值收窄
function process(input: string | null) {
  if (input) {
    input.trim();   // 收窄为 string（排除了 null 和 ''）
  }
}

interface Admin { role: 'admin'; permissions: string[]; }
interface Guest { role: 'guest'; }
type Account = Admin | Guest;

// 类型谓词：返回 account is Admin
function isAdmin(account: Account): account is Admin {
  return account.role === 'admin';
}

function handle(account: Account) {
  if (isAdmin(account)) {
    console.log(account.permissions); // 收窄为 Admin，可访问 permissions
  }
}

// 用于过滤数组并收窄元素类型
function isDefined<T>(value: T | undefined | null): value is T {
  return value !== undefined && value !== null;
}
const mixed = [1, undefined, 2, null, 3];
const cleaned = mixed.filter(isDefined); // number[]（去掉了 undefined/null）

// asserts 条件：断言后续代码里条件为真
function assert(condition: unknown, msg?: string): asserts condition {
  if (!condition) throw new Error(msg ?? '断言失败');
}
function getLength(value: string | null): number {
  assert(value !== null, 'value 不能为空');
  return value.length; // 此后 value 收窄为 string
}

// asserts x is Type：断言 x 是某类型
function assertIsString(val: unknown): asserts val is string {
  if (typeof val !== 'string') throw new Error('不是字符串');
}
function useValue(input: unknown) {
  assertIsString(input);
  input.toUpperCase(); // input 收窄为 string
}

// 建模异步请求的四种状态
type RequestState<T> =
  | { status: 'idle' }
  | { status: 'loading' }
  | { status: 'success'; data: T }
  | { status: 'error'; error: string };

function render<T>(state: RequestState<T>): string {
  switch (state.status) {
    case 'idle':    return '空闲';
    case 'loading': return '加载中...';
    case 'success': return `数据：${JSON.stringify(state.data)}`; // 可访问 data
    case 'error':   return `错误：${state.error}`;                // 可访问 error
    default:
      // 穷尽检查：若漏了某个 status，这里编译报错
      const _exhaustive: never = state;
      return _exhaustive;
  }
}

// Partial<T>：把所有属性变可选
type MyPartial<T> = {
  [P in keyof T]?: T[P]; // 遍历 T 的每个键 P，加 ? 变可选
};

// Required<T>：把所有属性变必填（-? 去掉可选修饰符）
type MyRequired<T> = {
  [P in keyof T]-?: T[P]; // -? 移除可选标记
};

// Readonly<T>：把所有属性变只读
type MyReadonly<T> = {
  readonly [P in keyof T]: T[P]; // 每个键加 readonly
};

interface User { id: number; name: string; email?: string; }
type PartialUser = MyPartial<User>;   // { id?; name?; email? }
type RequiredUser = MyRequired<User>; // { id; name; email }（email 变必填）
type ReadonlyUser = MyReadonly<User>; // 全部只读

// Pick<T, K>：从 T 中挑选 K 指定的键
type MyPick<T, K extends keyof T> = {
  [P in K]: T[P]; // 只遍历 K（K 被约束为 T 的键子集）
};

// Omit<T, K>：从 T 中排除 K 指定的键
type MyOmit<T, K extends keyof any> = MyPick<T, Exclude<keyof T, K>>;
// 原理：先用 Exclude 从 keyof T 里去掉 K，再 Pick 剩下的

type UserPreview = MyPick<User, 'id' | 'name'>;      // { id; name }
type UserNoEmail = MyOmit<User, 'email'>;            // { id; name }

// Record<K, V>：构造键为 K、值为 V 的对象类型
type MyRecord<K extends keyof any, V> = {
  [P in K]: V; // 遍历 K 的每个成员，值都设为 V
};

type PageInfo = { title: string };
type Pages = MyRecord<'home' | 'about' | 'contact', PageInfo>;
// { home: PageInfo; about: PageInfo; contact: PageInfo }

// 常用于字典/映射
type Scores = Record<string, number>;
const s: Scores = { math: 90, english: 85 };

// Exclude<T, U>：从联合 T 中去掉可赋给 U 的成员
type MyExclude<T, U> = T extends U ? never : T;

// Extract<T, U>：从联合 T 中保留可赋给 U 的成员
type MyExtract<T, U> = T extends U ? T : never;

// NonNullable<T>：去掉 null 和 undefined
type MyNonNullable<T> = T extends null | undefined ? never : T;

type T1 = MyExclude<'a' | 'b' | 'c', 'a'>;        // 'b' | 'c'
type T2 = MyExtract<'a' | 'b' | 'c', 'a' | 'z'>;  // 'a'
type T3 = MyNonNullable<string | null | undefined>; // string

// ReturnType<T>：提取函数返回值类型
type MyReturnType<T extends (...args: any) => any> =
  T extends (...args: any) => infer R ? R : never;

// Parameters<T>：提取函数参数类型（作为元组）
type MyParameters<T extends (...args: any) => any> =
  T extends (...args: infer P) => any ? P : never;

// InstanceType<T>：提取构造函数返回的实例类型
type MyInstanceType<T extends abstract new (...args: any) => any> =
  T extends abstract new (...args: any) => infer R ? R : never;

function createUser(id: number, name: string) {
  return { id, name, createdAt: Date.now() };
}
type CreateUserReturn = MyReturnType<typeof createUser>;    // { id; name; createdAt }
type CreateUserArgs = MyParameters<typeof createUser>;       // [number, string]

class Widget { constructor(public w: number) {} }
type W = MyInstanceType<typeof Widget>;                      // Widget

// 简化版 Awaited：递归解包嵌套 Promise
type MyAwaited<T> =
  T extends Promise<infer U>
    ? MyAwaited<U>   // 若解包后还是 Promise，继续递归
    : T;

type A1 = MyAwaited<Promise<string>>;               // string
type A2 = MyAwaited<Promise<Promise<number>>>;      // number（递归解到底）
type A3 = MyAwaited<boolean>;                        // boolean

// 实战：拿到 async 函数的真实返回值
async function fetchUser() { return { id: 1, name: 'Alice' }; }
type FetchedUser = Awaited<ReturnType<typeof fetchUser>>; // { id; name }

// 基础映射 + 修饰符增删
type Mutable<T> = {
  -readonly [P in keyof T]: T[P]; // 移除 readonly
};

// 键重映射：给每个键加 get 前缀，生成 getter 类型
type Getters<T> = {
  [P in keyof T as `get${Capitalize<string & P>}`]: () => T[P];
};
interface Person { name: string; age: number; }
type PersonGetters = Getters<Person>;
// { getName: () => string; getAge: () => number }

// 键重映射过滤：用 never 剔除不想要的键
type RemoveKind<T> = {
  [P in keyof T as P extends 'kind' ? never : P]: T[P];
};
type WithoutKind = RemoveKind<{ kind: string; value: number }>; // { value: number }

// 只保留值为函数的键（提取方法）
type MethodsOnly<T> = {
  [P in keyof T as T[P] extends Function ? P : never]: T[P];
};

// 基础拼接
type Greeting = `Hello, ${string}!`;
const g1: Greeting = 'Hello, world!';  // OK
// const g2: Greeting = 'Hi';          // Error

// 联合分发式组合（笛卡尔积）
type Color = 'red' | 'blue';
type Shade = 'light' | 'dark';
type ColorShade = `${Shade}-${Color}`;
// 'light-red' | 'light-blue' | 'dark-red' | 'dark-blue'

// 内置字符串操作
type EventName<T extends string> = `on${Capitalize<T>}`;
type ClickEvent = EventName<'click'>; // 'onClick'

type Loud = Uppercase<'hello'>;       // 'HELLO'
type Quiet = Lowercase<'HELLO'>;      // 'hello'

// 结合 infer 解析字符串
type ExtractRouteParam<T extends string> =
  T extends `/${string}/:${infer Param}` ? Param : never;
type Param = ExtractRouteParam<'/users/:id'>; // 'id'

// DeepReadonly：递归只读
type DeepReadonly<T> = {
  readonly [P in keyof T]: T[P] extends object
    ? DeepReadonly<T[P]>  // 值是对象则递归
    : T[P];
};
interface Nested { a: { b: { c: number } }; }
type FrozenNested = DeepReadonly<Nested>; // 所有层级只读

// DeepPartial：递归可选
type DeepPartial<T> = {
  [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
};

// 类型体操：数组长度（利用元组 length）
type Length<T extends readonly any[]> = T['length'];
type L = Length<[1, 2, 3]>; // 3

// 类型体操：字符串转联合
type StringToUnion<S extends string> =
  S extends `${infer First}${infer Rest}`
    ? First | StringToUnion<Rest>
    : never;
type Chars = StringToUnion<'abc'>; // 'a' | 'b' | 'c'

// 类型体操：反转元组
type Reverse<T extends any[]> =
  T extends [infer First, ...infer Rest]
    ? [...Reverse<Rest>, First]
    : [];
type Reversed = Reverse<[1, 2, 3]>; // [3, 2, 1]

// 命名导出与导入
export interface User { id: number; name: string; }
export function createUser(name: string): User {
  return { id: Date.now(), name };
}
export const VERSION = '1.0.0';

// 默认导出
export default class ApiClient { /* ... */ }

// 仅导入类型（编译后完全擦除，不产生 import 语句）
import type { User } from './user';
// 混合导入，用 inline type 标记类型部分
import { createUser, type User as U } from './user';

namespace Validation {
  export interface Validator {
    isValid(s: string): boolean;
  }
  export class EmailValidator implements Validator {
    isValid(s: string) { return /@/.test(s); }
  }
}
const v = new Validation.EmailValidator();

// global.d.ts —— 声明全局变量与模块
declare const __APP_VERSION__: string;         // 构建时注入的全局常量
declare function gtag(...args: any[]): void;    // 第三方脚本注入的全局函数

// 为没有类型的 JS 模块补声明
declare module 'legacy-lib' {
  export function doSomething(input: string): number;
  export const config: { debug: boolean };
}

// 为非 JS 资源声明模块（如 import 图片/样式）
declare module '*.svg' {
  const content: string;
  export default content;
}
declare module '*.module.css' {
  const classes: { readonly [key: string]: string };
  export default classes;
}

// 扩展全局接口
declare global {
  interface Window {
    dataLayer: unknown[];
  }
}
export {}; // 让本文件成为模块，declare global 才生效

// 三斜线指令：引用其他声明文件或库类型（多见于 .d.ts）
/// <reference types="node" />
/// <reference path="./other.d.ts" />

// strictNullChecks 开启后的差异
function getLength(s: string | null) {
  // return s.length;      // Error: s 可能为 null
  return s?.length ?? 0;   // 正确处理
}

// tsconfig.json 关键片段（示意）
// {
//   "compilerOptions": {
//     "target": "ES2020",            // 编译目标 JS 版本
//     "module": "ESNext",            // 输出模块格式
//     "moduleResolution": "Bundler", // 模块解析策略
//     "baseUrl": ".",
//     "paths": { "@/*": ["src/*"] }, // 路径别名
//     "lib": ["ES2020", "DOM"],      // 可用的内置类型库
//     "esModuleInterop": true,       // CJS/ESM 互操作
//     "skipLibCheck": true,          // 跳过 .d.ts 检查（提速）
//     "resolveJsonModule": true      // 允许 import JSON
//   }
// }

// TC39 标准装饰器（TS 5.0+，无需 experimentalDecorators）
function logged<This, Args extends any[], Return>(
  target: (this: This, ...args: Args) => Return,
  context: ClassMethodDecoratorContext
) {
  const name = String(context.name);
  return function (this: This, ...args: Args): Return {
    console.log(`调用 ${name}，参数：`, args);
    return target.call(this, ...args);
  };
}

class Calculator {
  @logged
  add(a: number, b: number) { return a + b; }
}

import { useState, type ReactNode, type FC } from 'react';

// 组件 props 类型
interface CardProps {
  title: string;
  children: ReactNode;      // 可渲染内容
  onClose?: () => void;     // 可选回调
}

const Card: FC<CardProps> = ({ title, children, onClose }) => {
  const [open, setOpen] = useState<boolean>(true); // 泛型指定 state 类型
  if (!open) return null;
  return null; // 示意
};

// 事件类型
function handleChange(e: React.ChangeEvent<HTMLInputElement>) {
  console.log(e.target.value);
}

// 泛型组件
interface ListProps<T> {
  items: T[];
  renderItem: (item: T) => ReactNode;
}
function List<T>({ items, renderItem }: ListProps<T>) {
  return items.map(renderItem);
}

import { defineComponent, ref, type PropType } from 'vue';

interface Todo { id: number; text: string; done: boolean; }

export default defineComponent({
  props: {
    // 用 PropType 标注复杂类型
    todos: { type: Array as PropType<Todo[]>, required: true },
    title: { type: String, default: '待办' },
  },
  setup(props) {
    const count = ref<number>(0); // ref 泛型
    const addCount = () => { count.value++; };
    return { count, addCount };
  },
});

// 结构兼容：只要结构满足即可赋值
interface Point2D { x: number; y: number; }
interface Point3D { x: number; y: number; z: number; }
let p2: Point2D;
let p3: Point3D = { x: 1, y: 2, z: 3 };
p2 = p3; // OK：Point3D 结构上包含 Point2D（多的属性无妨）
// p3 = p2; // Error：缺少 z

// 协变：返回值、数组元素
type Animal = { name: string };
type Dog = { name: string; bark: () => void };
let animals: Animal[];
let dogs: Dog[] = [{ name: 'a', bark: () => {} }];
animals = dogs; // 协变：Dog[] 可赋给 Animal[]

// 逆变：函数参数（strictFunctionTypes 下）
type AnimalHandler = (a: Animal) => void;
type DogHandler = (d: Dog) => void;
let handleAnimal: AnimalHandler = (a) => console.log(a.name);
let handleDog: DogHandler = handleAnimal; // OK：参数逆变，接受更宽的处理器
// handleAnimal = handleDog; // Error：handleDog 需要 bark，但传入的可能只是 Animal

// 统一响应包装
interface ApiResult<T> {
  code: number;
  data: T;
  message: string;
}

// 定义接口映射：路径 -> 响应数据类型
interface ApiMap {
  '/user/profile': { id: number; name: string; avatar: string };
  '/order/list': { orders: Array<{ id: string; total: number }> };
}

// 泛型请求函数：传入 path，自动推断返回类型
async function request<P extends keyof ApiMap>(
  path: P
): Promise<ApiResult<ApiMap[P]>> {
  const res = await fetch(path);
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return res.json();
}

// 使用：返回类型被精确推断，无需手动断言
async function demo() {
  const profile = await request('/user/profile');
  console.log(profile.data.name);   // string，IDE 有补全
  const orders = await request('/order/list');
  console.log(orders.data.orders[0].total); // number
}

// 事件名 -> payload 类型
interface EventPayloads {
  login: { userId: number };
  logout: undefined;
  message: { from: string; text: string };
}

class TypedEmitter {
  private handlers: {
    [K in keyof EventPayloads]?: Array<(payload: EventPayloads[K]) => void>;
  } = {};

  on<K extends keyof EventPayloads>(
    event: K,
    handler: (payload: EventPayloads[K]) => void
  ): void {
    (this.handlers[event] ??= []).push(handler as any);
  }

  emit<K extends keyof EventPayloads>(event: K, payload: EventPayloads[K]): void {
    this.handlers[event]?.forEach(h => h(payload));
  }
}

const bus = new TypedEmitter();
bus.on('login', p => console.log(p.userId));   // p 类型精确
bus.emit('login', { userId: 1 });               // payload 校验
// bus.emit('login', { userId: 'x' });          // Error：userId 应为 number

type RGB = [number, number, number];
type Palette = Record<string, RGB | string>;

// 用 : Palette 标注：green 会被拓宽成 RGB | string，丢失元组精度
const p1: Palette = { red: [255, 0, 0], green: '#00ff00' };
// p1.red 类型是 RGB | string，无法直接当元组用

// 用 satisfies：既校验满足 Palette，又保留每个值的精确类型
const p2 = {
  red: [255, 0, 0],
  green: '#00ff00',
} satisfies Palette;
p2.red[0];              // number，保留了元组类型
p2.green.toUpperCase(); // string，保留了字符串类型

// 交叉一个带唯一 tag 的类型，制造名义上的区别
type Brand<T, B extends string> = T & { readonly __brand: B };
type UserId = Brand<string, 'UserId'>;
type OrderId = Brand<string, 'OrderId'>;

function asUserId(id: string): UserId { return id as UserId; }
function getUser(id: UserId) { /* ... */ }

const uid = asUserId('u_123');
getUser(uid);          // OK
// getUser('u_123');   // Error：普通 string 不能当 UserId
// getUser(orderId);   // Error：OrderId 不能当 UserId