如何通过TypeScript面试：高级别热门问题

如何通过TypeScript面试：高级别热门问题

高级前端或全栈开发人员的面试中，很少能避开关于TypeScript的深入问题。如果你已经熟练掌握基本类型和接口，那么要通过高级别的技术面试，就需要深入了解高级类型系统。在本文中，我们整理了高级TypeScript面试中经常被问到的5大热门问题和任务。每个要点都附有解析和代码示例。

1. 条件类型（Conditional Types）和关键字 infer

条件类型允许你创建依赖于条件的类型。结合 infer，你可以像模式匹配一样“提取”类型的部分。

问题： 编写一个 ReturnType 类型（不使用内置类型）。

解析： 使用带有 infer 的条件类型来捕获函数的返回值类型。

type MyReturnType<T> = T extends (...args: any[]) => infer R ? R : never;\n\n// 使用示例\nfunction greet(name: string): string {\n  return `Hello, ${name}`;\n}\n\ntype GreetReturn = MyReturnType<typeof greet>; // string

如何在面试中回答： 解释 infer R 创建了一个新的类型变量 R，它从函数签名中捕获返回类型。如果条件不满足（传入的不是函数），类型变为 never。

2. 映射类型（Mapped Types）和修饰符

映射类型允许你通过转换现有类型的属性来创建新类型。高级水平涉及使用修饰符 +、-、as 以及通过 keyof 操作键。

问题： 创建一个 DeepReadonly 类型，使对象的所有属性（包括嵌套属性）变为只读。

type DeepReadonly<T> = {\n  readonly [K in keyof T]: T[K] extends Record<string, unknown> \n    ? DeepReadonly<T[K]> \n    : T[K];\n};\n\ninterface User {\n  name: string;\n  address: {\n    city: string;\n    zip: number;\n  };\n}\n\ntype ReadonlyUser = DeepReadonly<User>;\n// 所有属性变为只读，包括 address.city

如何回答： 展示对嵌套对象递归调用 DeepReadonly。解释如何使用 Record<string, unknown> 来检查值是否为对象。

3. 模板字面量类型（Template Literal Types）

模板字面量类型允许在编译时操作字符串类型。这是创建严格API的强大工具。

问题： 实现一个 EventName 类型，它接受一个字符串并返回带有正确首字母大写的 "on{字符串}" 类型。

type EventName<T extends string> = `on${Capitalize<T>}`;\n\ntype ClickEvent = EventName<'click'>; // "onClick"\ntype FocusEvent = EventName<'focus'>; // "onFocus"\n\n// 高级示例：从字符串中提取\ntype ExtractAction<T extends string> = \n  T extends `on${infer Action}` ? Uncapitalize<Action> : never;\n\ntype Action = ExtractAction<'onSubmit'>; // "submit"

如何回答： 注意内置类型 Capitalize 和 Uncapitalize。展示 infer 如何在模板字面量内部工作以解析字符串。

4. 带约束的泛型和可变元组类型（Variadic Tuple Types）

可变元组类型（在TS 4.0中引入）允许处理任意长度的元组。这在创建具有可变数量参数的类型安全函数时不可或缺。

问题： 为一个函数编写类型，该函数接受任意数量的参数并返回它们的元组。

// 使用可变元组类型\nfunction tuple<T extends any[]>(...args: T): T {\n  return args;\n}\n\n// 类型安全\nconst result = tuple(1, 'hello', true); // [number, string, boolean]

如何回答： 解释 T extends any[] 允许函数接受任意数量的参数，并且返回类型 T 保留了每个参数的确切类型。