TypeScript 进阶：类型系统的力量

为什么用 TypeScript？

• 类型安全：编译期发现错误
• 智能提示：IDE 自动补全
• 重构友好：修改类型自动检查
• 文档即代码：类型即文档

高级类型技巧

1. 泛型约束

interface Lengthwise {
  length: number;
}

function logLength<T extends Lengthwise>(arg: T): T {
  console.log(arg.length);
  return arg;
}

logLength("hello"); // ✅
logLength(123); // ❌ 没有 length 属性

2. 条件类型

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

type A = IsString<string>;  // true
type B = IsString<number>;  // false

3. 映射类型

type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};

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

4. 工具类型

// 提取部分字段
type UserPreview = Pick<User, "id" | "name">;

// 排除某些字段
type UserWithoutPassword = Omit<User, "password">;

// 提取函数参数类型
type Params = Parameters<typeof createUser>;

// 提取返回值类型
type User = ReturnType<typeof createUser>;

类型守卫

// typeof 守卫
function printId(id: number | string) {
  if (typeof id === "number") {
    console.log(id.toFixed(2));
  } else {
    console.log(id.toUpperCase());
  }
}

// in 守卫
interface Cat { meow(): void }
interface Dog { bark(): void }

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

// 自定义类型谓词
function isCat(pet: any): pet is Cat {
  return pet.meow !== undefined;
}

实用类型模式

// 不可变类型
type Immutable<T> = {
  readonly [P in keyof T]: T[P];
};

// 深度只读
type DeepReadonly<T> = {
  readonly [P in keyof T]: T[P] extends object 
    ? DeepReadonly<T[P]> 
    : T[P];
};

// 排除 null/undefined
type NonNullable<T> = T extends null | undefined ? never : T;

TypeScript 类型系统强大而优雅，掌握它能写出更健壮的代码！