Typescript 必须的所有技巧

我们一起总结TypeScript技巧主要围绕类型定义、代码维护和开发效率展开，你学会了吗？

大家好，我是林三心，用最通俗易懂的话讲最难的知识点是我的座右铭，基础是进阶的前提是我的初心~

一、常用工具类型分类

1. 基础修饰类

Partial<T>将类型 T 的所有属性变为可选。

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

type PartialUser = Partial<User>;
// 等价于 { id?: number; name?: string; age?: number }

适用场景：如更新用户信息时，允许部分字段可选。

Required<T>将类型 T 的所有属性变为必填。

interface Config {
  url?: string;
  cache?: boolean;
}

type StrictConfig = Required<Config>;
// { url: string; cache: boolean }

适用场景：要求配置对象必须提供所有属性。

Readonly<T>将类型 T 的所有属性设为只读。

interface Point {
  x: number;
  y: number;
}

type ReadonlyPoint = Readonly<Point>;
// { readonly x: number; readonly y: number }

适用场景：如 React 组件的 props 应不可变。

2. 结构挑选类

Pick<T, K>从 T 中选取指定属性 K。

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

type UserPreview = Pick<User, 'id' | 'name'>;
// { id: number; name: string }

适用场景：列表页仅展示部分字段。

Omit<T, K>从 T 中移除指定属性 K。

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

type SafeUser = Omit<User, 'password'>;
// { id: number; name: string }

适用场景：返回用户信息时隐藏敏感字段。

Record<K, T>构建一个键类型为 K、值类型为 T 的对象。

type Role = 'admin' | 'user';
type RoleMap = Record<Role, number>;
// { admin: number; user: number }

适用场景：构建枚举到权限的映射结构。

3. 类型过滤类

Exclude<T, U>从 T 中排除 U 中的类型。

type T = Exclude<'a' | 'b' | 'c', 'a'>;
// 'b' | 'c'

适用场景：过滤联合类型中的某些项。

Extract<T, U>提取 T 和 U 中共有的类型。

type T = Extract<'a' | 'b' | 'c', 'a' | 'f'>;
// 'a'

适用场景：提取允许使用的类型子集。

NonNullable<T>排除 T 中的 null 和 undefined。

type T = NonNullable<string | null | undefined>;
// string

适用场景：严格模式下确保类型不为空。

4. 函数相关类

ReturnType<T>提取函数 T 的返回值类型。

function fetchUser() {
  return { id: 1, name: 'Alice' };
}

type User = ReturnType<typeof fetchUser>;
// { id: number; name: string }

适用场景：提取接口返回值类型，避免重复声明。

Parameters<T>提取函数 T 的参数类型元组。

function greet(name: string, age: number) {}

type Params = Parameters<typeof greet>;
// [string, number]

适用场景：复用已有函数的参数类型。

ConstructorParameters<T>提取构造函数 T 的参数类型。

class Person {
  constructor(name: string, age: number) {}
}

type Params = ConstructorParameters<typeof Person>;
// [string, number]

适用场景：工厂函数中自动推断构造参数。

InstanceType<T>提取构造函数 T 的实例类型。

class Person {
  name: string;
  constructor(name: string) { this.name = name; }
}

type P = InstanceType<typeof Person>;
// Person

适用场景：基于类类型生成其实例类型。

ThisParameterType<T>提取函数 T 的 this 类型。

function say(this: { name: string }) { return this.name; }

type T = ThisParameterType<typeof say>;
// { name: string }

适用场景：约束函数中的上下文类型。

OmitThisParameter<T>移除函数 T 的 this 参数类型。

function say(this: { name: string }) { return this.name; }

type Fn = OmitThisParameter<typeof say>;
// () => string

适用场景：将绑定 this 的函数转为无 this 的普通函数。

二、实际应用示例

1. 提取 API 返回值并隐藏敏感字段

async function getUser() {
  return { id: 1, name: 'Tom', token: 'secret' };
}

type User = Omit<ReturnType<typeof getUser>, 'token'>;
// { id: number; name: string }

2. 表单局部更新

interface UserForm {
  name: string;
  age: number;
  email: string;
}

function updateUser(id: number, data: Partial<UserForm>) {}

3. 构建路由映射配置

type Routes = 'home' | 'about' | 'login';
type RouteConfig = Record<Routes, string>;
// { home: string; about: string; login: string }

4. 强制 React 组件 Props 必传

interface ButtonProps {
  label: string;
  onClick: () => void;
  disabled?: boolean;
}

type RequiredButton = Required<ButtonProps>;
// 所有属性变为必填

AI大模型学习福利

作为一名热心肠的互联网老兵，我决定把宝贵的AI知识分享给大家。 至于能学习到多少就看你的学习毅力和能力了 。我已将重要的AI大模型资料包括AI大模型入门学习思维导图、精品AI大模型学习书籍手册、视频教程、实战学习等录播视频免费分享出来。

一、全套AGI大模型学习路线

AI大模型时代的学习之旅：从基础到前沿，掌握人工智能的核心技能！

因篇幅有限，仅展示部分资料，需要点击文章最下方名片即可前往获取

二、640套AI大模型报告合集

这套包含640份报告的合集，涵盖了AI大模型的理论研究、技术实现、行业应用等多个方面。无论您是科研人员、工程师，还是对AI大模型感兴趣的爱好者，这套报告合集都将为您提供宝贵的信息和启示。

因篇幅有限，仅展示部分资料，需要点击文章最下方名片即可前往获

三、AI大模型经典PDF籍

随着人工智能技术的飞速发展，AI大模型已经成为了当今科技领域的一大热点。这些大型预训练模型，如GPT-3、BERT、XLNet等，以其强大的语言理解和生成能力，正在改变我们对人工智能的认识。 那以下这些PDF籍就是非常不错的学习资源。

因篇幅有限，仅展示部分资料，需要点击文章最下方名片即可前往获

四、AI大模型商业化落地方案

因篇幅有限，仅展示部分资料，需要点击文章最下方名片即可前往获

作为普通人，入局大模型时代需要持续学习和实践，不断提高自己的技能和认知水平，同时也需要有责任感和伦理意识，为人工智能的健康发展贡献力量