TypeScript：面试准备完全指南

为什么 TypeScript 是现代开发者的必备技能？

如果您打开了这篇文章，说明您已经知道 TypeScript 不仅仅是“JavaScript 的超集”，而是一个能够拯救神经细胞和生产服务器的完整工具。在 2025 年的面试中，近 80% 的中级以上职位都会考察 TypeScript 知识。而且这不仅仅是写出 const a: number = 5。面试官希望看到您对类型系统、泛型的理解，以及设计安全架构的能力。

在本文中，我们将解析 TypeScript 面试中最常见的问题，这些问题在顶级公司中真实出现。您不仅会获得理论知识，还会获得 TypeScript 代码示例，可以立即在个人项目中使用。开始吧！

1. 基础：类型、接口及其区别

第一组问题是基础性的。面试官想确认您不会混淆 type 和 interface。

何时使用 type，何时使用 interface？

经典问题。记住这个简单规则：

\n
• Interface — 用于可扩展的对象（声明合并）。用于 API、DTO、组件属性。
\n
• Type — 用于联合类型 (union)、交叉类型、基本类型和元组。
\n

真实面试中的示例：

// Interface — 可扩展\ninterface User {\n    id: number;\n    name: string;\n}\n\ninterface AdminUser extends User {\n    role: 'admin';\n}\n\n// Type — 联合类型\ntype Status = 'active' | 'inactive' | 'banned';\ntype ApiResponse<T> = {\n    data: T;\n    error?: string;\n};

重要提示： 永远不要说“interface 更好，因为它更快”。性能差异微乎其微。关键是语义。

2. 泛型：如何在面试中不丢脸

TypeScript 泛型 是初级开发者的痛点。面试官喜欢让您编写一个接受数组并返回第一个元素且类型正确的函数。

编写泛型函数

function getFirst<T>(arr: T[]): T | undefined {\n    return arr[0];\n}\n\nconst num = getFirst([1, 2, 3]); // number\nconst str = getFirst(['a', 'b']); // string

现在增加难度 — 使用 extends 限制泛型：

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {\n    return obj[key];\n}\n\nconst user = { name: 'Alice', age: 30 };\ngetProperty(user, 'name'); // OK: string\ngetProperty(user, 'email'); // Error: 'email' 不在 keyof 中

这种模式在每个 React + TypeScript 项目中都会出现。请务必在自己的项目中练习编写 TypeScript 泛型。

3. 实用类型：您的秘密武器库

了解内置的实用类型是专业水平的标志。面试官可能会问：“如何让所有字段变为可选？”或“如何只选择接口的一部分？”

需要了解的前 5 个实用类型

\n
• Partial<T> — 所有字段变为可选；
\n
• Required<T> — 所有字段变为必填；
\n
• Pick<T, K> — 只选择指定的键；
\n
• Omit<T, K> — 排除指定的键；
\n
• Record<K, V> — 创建一个键为 K、值为 V 的对象类型。
\n

面试中常给的示例：

interface Todo {\n    title: string;\n    description: string;\n    completed: boolean;\n    createdAt: Date;\n}\n\n// 只更新 Todo 的一部分\nfunction updateTodo(todo: Todo, fieldsToUpdate: Partial<Todo>) {\n    return { ...todo, ...fieldsToUpdate };\n}\n\n// 创建字典\nconst