TypeScript面试题手册

​

引言在TypeScript开发中，枚举（Enum）是构建类型安全代码的关键工具，它允许开发者定义一组命名的常量集合，从而提升代码的可读性、可维护性和编译时检查能力。与JavaScript不同，TypeScript作为超集语言，提供了编译时的类型推断和错误预防机制，使枚举成为处理状态机、配置选项或业务规则的首选方案。本文将深入探讨TypeScript中枚举的处理方法，包括基础用法、高级技巧及实践建议，帮助开发者避免常见陷阱并优化代码结构。根据TypeScript官方文档，枚举本质上是通过enum关键字创建的类型，其值在编译阶段被转换为具体的JavaScript值，但保留了类型检查能力——这一特性在大型项目中尤为重要，能显著减少运行时错误。枚举的基本概念什么是枚举？枚举是TypeScript中用于定义命名常量集合的类型。它通过将一组相关的值映射到有意义的名称，使代码更易理解。例如，在表示颜色时，Red、Green和Blue比使用数字0、1、2更直观。枚举分为数字枚举、字符串枚举和异构枚举，其核心特性是：编译时类型检查：编译器确保枚举值在使用时符合定义。默认值行为：数字枚举默认从0开始递增；字符串枚举则使用指定字符串。隐式转换：枚举值可自动转换为数字或字符串，但需谨慎使用以避免意外行为。创建简单枚举基本枚举通过enum关键字声明。以下示例展示了一个数字枚举：enum Status { Pending = 0, Approved = 1, Rejected = 2}// 使用枚举const jobStatus: Status = Status.Approved;console.log(jobStatus); // 输出: 1// 类型检查：编译器会捕获非法值// const invalidStatus: Status = 3; // 错误：类型 'number' 不符合 'Status'关键点：数字枚举默认从0开始，但可通过显式赋值覆盖。此示例中，Pending被显式设为0，避免隐式递增导致的逻辑错误。实践中，建议始终显式赋值以保证可预测性。枚举的类型推断TypeScript支持枚举的类型推断，但需注意其行为：当枚举值未显式赋值时，数字枚举自动递增（如enum Level { Low, Medium } → Low=0, Medium=1）。字符串枚举的值必须明确指定，否则编译失败。例如：enum LogLevel { Debug = 'DEBUG', Info = 'INFO'}const logLevel: LogLevel = LogLevel.Debug;console.log(logLevel); // 输出: 'DEBUG'// 类型推断：若未指定值，编译器会报错// enum InvalidEnum { First } // 错误：字符串枚举必须显式赋值高级枚举处理数字枚举的深度应用数字枚举适用于需要数值计算的场景，如状态码。但需避免隐式递增导致的错误：enum ProductType { Electronics = 100, Clothing = 101, Books = 102}// 通过枚举值计算const total = ProductType.Electronics + ProductType.Clothing; // 202// 常见陷阱：隐式递增可能导致意外值// enum Status { Draft, Published } // Draft=0, Published=1最佳实践：始终显式赋值，尤其在业务逻辑中。数字枚举适用于需要数值操作的场景，但应避免与字符串枚举混合使用，以防类型混淆。字符串枚举：提升可读性字符串枚举使用字符串值，适合UI或配置场景，能避免数字误用：enum Language { English = 'en-US', Spanish = 'es-ES', French = 'fr-FR'}const userLang: Language = Language.Spanish;console.log(userLang); // 输出: 'es-ES'// 验证枚举值function validateLang(lang: Language): boolean { return ['en-US', 'es-ES', 'fr-FR'].includes(lang);}console.log(validateLang(Language.English)); // true优势：字符串枚举在运行时更安全，因为字符串值是不可变的。同时，TypeScript会严格检查值是否匹配，防止意外赋值（如'invalid'）。异构枚举：处理混合类型TypeScript支持异构枚举，即枚举值包含不同数据类型，适用于复杂场景：enum PaymentMethod { CreditCard = 'cc', PayPal = { type: 'paypal', token: 'abc123' }, Cash = 'cash'}// 使用异构值const payment: PaymentMethod = PaymentMethod.PayPal;if (typeof payment === 'object') { console.log(payment.type); // 输出: 'paypal'}// 编译时检查：类型推断会识别值类型function processPayment(method: PaymentMethod) { if (typeof method === 'string') { // 处理字符串类型 } else { // 处理对象类型 }}注意：异构枚举在编译阶段可能引发警告，建议仅在必要时使用，以保持代码简洁。TypeScript 4.5+ 支持此特性，但需确保项目配置兼容。实践建议何时使用枚举使用场景：当需要定义一组固定、互斥的常量时，如状态码、配置选项或UI组件类型。避免场景：对于动态生成的值（如用户输入），应使用普通变量或接口，避免枚举僵化。替代方案：对于大型项目，优先考虑使用const或enum的组合（如const { Pending, Approved } = Status），以提升可读性。常见陷阱与解决方案隐式递增问题：数字枚举默认从0开始，可能导致逻辑错误。解决方案：显式赋值所有值，例如enum Status { Pending = 0, ... }。类型混淆：数字枚举和字符串枚举混合使用时，编译器可能无法区分。解决方案：在代码中明确注释，或使用TypeScript的as断言处理。枚举污染：全局枚举可能导致命名冲突。解决方案：将枚举封装在命名空间或模块中，例如：namespace MyProject { enum Color { Red, Green }}性能考量枚举在编译时被转换为JavaScript对象，因此对性能影响极小。但在大型项目中，过度使用枚举可能增加代码体积。建议：仅在必要时使用枚举，避免在频繁迭代的循环中使用。优先使用字符串枚举，因其在运行时更高效（无额外对象开销）。结论TypeScript枚举是构建类型安全应用的核心工具，通过合理处理枚举，开发者能显著提升代码质量和可维护性。本文详细介绍了基本用法、高级技巧及实践建议，强调了显式赋值、类型推断和避免常见陷阱的重要性。在实际项目中，建议结合官方文档（TypeScript Documentation）进行实践，并根据场景选择合适的枚举类型。记住：枚举不是万能的，需与接口、类型别名等结合使用，以构建健壮的TypeScript代码。最终，处理枚举的核心原则是——保持代码清晰，避免过度复杂化。 附录：代码示例汇总图：TypeScript枚举的编译流程示意图（来源：TypeScript官方文档）

Deno 原生支持 TypeScript，这是其最吸引人的特性之一。与 Node.js 需要配置 TypeScript 编译器不同，Deno 可以直接运行 TypeScript 文件，无需任何额外的转译步骤。TypeScript 支持概述Deno 内置了 TypeScript 编译器，使用 V8 引擎的 TypeScript 支持和 swc 编译器来提供快速的类型检查和转译。直接运行 TypeScript1. 基本用法// app.tsinterface User { id: number; name: string; email: string;}function createUser(user: User): User { console.log(`Creating user: ${user.name}`); return user;}const newUser: User = { id: 1, name: "John Doe", email: "john@example.com"};createUser(newUser);运行：deno run app.ts2. 类型检查Deno 会在运行时进行类型检查：# 运行时进行类型检查deno run app.ts# 仅类型检查（不执行）deno check app.ts# 类型检查所有文件deno check **/*.ts类型定义1. 使用 Deno 内置类型Deno 提供了丰富的内置类型定义：// 文件系统操作const content: string = await Deno.readTextFile("./data.txt");// HTTP 服务器import { serve } from "https://deno.land/std@0.208.0/http/server.ts";const handler = async (req: Request): Promise<Response> => { return new Response("Hello World");};2. 第三方库类型从 URL 导入的模块通常包含类型定义：import { Application, Router } from "https://deno.land/x/oak@v12.6.1/mod.ts";const app = new Application();const router = new Router();3. 自定义类型定义如果模块没有类型定义，可以创建自定义类型：// types.d.tsdeclare module "https://example.com/module.js" { export function doSomething(): void; export const value: number;}配置选项1. tsconfig.jsonDeno 支持使用 tsconfig.json 进行配置：{ "compilerOptions": { "strict": true, "esModuleInterop": true, "skipLibCheck": true }, "include": ["src/**/*"], "exclude": ["node_modules"]}2. 命令行选项# 禁用类型检查（不推荐）deno run --no-check app.ts# 使用特定的 tsconfigdeno run --config=tsconfig.json app.ts# 启用严格模式deno run app.ts # 默认启用严格模式类型检查策略1. 本地类型检查# 检查本地文件deno check app.ts# 检查整个项目deno check src/**/*.ts2. 远程类型检查Deno 会缓存远程模块的类型定义：# 重新下载并检查远程类型deno check --remote app.ts# 清除类型缓存deno cache --reload app.ts实际应用示例1. 类型安全的 API 服务器// api-server.tsinterface User { id: number; name: string; email: string;}interface CreateUserRequest { name: string; email: string;}const users: Map<number, User> = new Map();function createUser(request: CreateUserRequest): User { const id = users.size + 1; const user: User = { id, ...request }; users.set(id, user); return user;}import { serve } from "https://deno.land/std@0.208.0/http/server.ts";const handler = async (req: Request): Promise<Response> => { const url = new URL(req.url); if (req.method === "POST" && url.pathname === "/users") { try { const body: CreateUserRequest = await req.json(); const user = createUser(body); return new Response(JSON.stringify(user), { headers: { "Content-Type": "application/json" } }); } catch (error) { return new Response("Invalid request", { status: 400 }); } } return new Response("Not Found", { status: 404 });};await serve(handler, { port: 8000 });2. 类型安全的数据库操作// database.tsinterface DatabaseRecord { id: string; createdAt: Date; updatedAt: Date;}interface Post extends DatabaseRecord { title: string; content: string; authorId: string;}class Database<T extends DatabaseRecord> { private records: Map<string, T> = new Map(); async create(record: Omit<T, keyof DatabaseRecord>): Promise<T> { const id = crypto.randomUUID(); const now = new Date(); const newRecord: T = { id, createdAt: now, updatedAt: now, ...record } as T; this.records.set(id, newRecord); return newRecord; } async findById(id: string): Promise<T | undefined> { return this.records.get(id); }}const postDB = new Database<Post();const newPost = await postDB.create({ title: "Hello Deno", content: "TypeScript support is amazing!", authorId: "user-1"});3. 类型安全的工具函数// utils.tstype AsyncFunction<T = any> = (...args: any[]) => Promise<T>;async function retry<T>( fn: AsyncFunction<T>, maxAttempts: number = 3, delay: number = 1000): Promise<T> { let lastError: Error | undefined; for (let attempt = 1; attempt <= maxAttempts; attempt++) { try { return await fn(); } catch (error) { lastError = error as Error; if (attempt < maxAttempts) { await new Promise(resolve => setTimeout(resolve, delay)); } } } throw lastError;}async function fetchWithTimeout( url: string, timeout: number = 5000): Promise<Response> { const controller = new AbortController(); const timeoutId = setTimeout(() => controller.abort(), timeout); try { const response = await fetch(url, { signal: controller.signal }); clearTimeout(timeoutId); return response; } catch (error) { clearTimeout(timeoutId); throw error; }}类型检查性能优化1. 增量类型检查Deno 会缓存类型检查结果：# 首次运行会进行完整类型检查deno run app.ts# 后续运行会使用缓存deno run app.ts2. 选择性类型检查# 只检查修改的文件deno check app.ts# 排除某些文件deno check --exclude=**/*.test.ts src/**/*.ts与 Node.js 的对比| 特性 | Deno | Node.js ||------|------|---------|| TypeScript 支持 | 原生支持 | 需要配置 tsc || 运行方式 | 直接运行 .ts 文件 | 需要先编译为 .js || 类型检查 | 运行时检查 | 编译时检查 || 配置复杂度 | 零配置 | 需要 tsconfig.json || 性能 | 使用 swc 快速编译 | 使用 tsc 较慢 || 类型定义 | 自动加载 | 需要 @types 包 |最佳实践始终使用类型：充分利用 TypeScript 的类型系统启用严格模式：使用 strict: true 获得更好的类型安全使用接口定义数据结构：明确 API 和数据模型的类型避免 any 类型：使用 unknown 或具体类型替代定期运行类型检查：使用 deno check 确保代码质量利用泛型：编写可复用的类型安全代码Deno 的 TypeScript 支持使得开发者能够享受类型安全的好处，而无需复杂的配置和构建流程，大大提高了开发效率和代码质量。

Rspack 对 TypeScript 提供了原生支持，这使得开发者无需额外配置即可处理 TypeScript 文件，大大简化了开发流程。以下是 Rspack TypeScript 支持的详细说明：原生 TypeScript 支持Rspack 内置了 TypeScript 支持，这意味着：无需额外 Loader：不需要安装 ts-loader 或其他 TypeScript loader直接导入 .ts 和 .tsx 文件即可自动处理 TypeScript 编译类型检查：支持类型检查（可选）可以配置是否进行类型检查提供类型错误提示类型声明文件：支持 .d.ts 类型声明文件自动解析类型声明提供完整的类型支持基本配置最小配置module.exports = { entry: './src/index.ts', module: { rules: [ { test: /\.ts$/, use: 'builtin:swc-loader', type: 'javascript/auto' } ] }}完整配置module.exports = { entry: './src/index.tsx', module: { rules: [ { test: /\.(ts|tsx)$/, use: { loader: 'builtin:swc-loader', options: { jsc: { parser: { syntax: 'typescript', tsx: true }, transform: { react: { runtime: 'automatic' } } } } }, type: 'javascript/auto' } ] }, resolve: { extensions: ['.ts', '.tsx', '.js', '.jsx'] }}SWC LoaderRspack 使用内置的 SWC Loader 来处理 TypeScript，SWC 是一个用 Rust 编写的超快 TypeScript/JavaScript 编译器：SWC 的优势极快的编译速度：比 Babel 快 20-70 倍比 tsc 快 10-30 倍显著提升构建速度完整的 TypeScript 支持：支持所有 TypeScript 语法支持最新的 ECMAScript 特性兼容 TypeScript 配置低内存占用：比 Babel 占用更少内存适合大型项目更好的资源利用率SWC 配置选项{ loader: 'builtin:swc-loader', options: { jsc: { parser: { syntax: 'typescript', tsx: true, decorators: true, dynamicImport: true }, transform: { react: { runtime: 'automatic', importSource: '@emotion/react' }, optimizer: { globals: { vars: { 'process.env.NODE_ENV': 'production' } } } }, target: 'es2015', loose: false, externalHelpers: true }, env: { targets: 'defaults', coreJs: 3 }, sourceMaps: true, inlineSourcesContent: true }}tsconfig.json 集成Rspack 可以读取和使用 tsconfig.json 配置：{ "compilerOptions": { "target": "ES2020", "module": "ESNext", "lib": ["ES2020", "DOM", "DOM.Iterable"], "jsx": "react-jsx", "strict": true, "moduleResolution": "node", "esModuleInterop": true, "skipLibCheck": true, "forceConsistentCasingInFileNames": true, "resolveJsonModule": true, "isolatedModules": true, "noEmit": true }, "include": ["src"], "exclude": ["node_modules"]}类型检查类型检查配置Rspack 支持两种类型检查方式：构建时类型检查： module.exports = { builtins: { pluginImport: [ { libraryName: 'lodash', libraryDirectory: '', camel2DashComponentName: false } ] }, plugins: [ new rspack.ForkTsCheckerWebpackPlugin({ typescript: { configFile: './tsconfig.json', memoryLimit: 4096 } }) ] }独立类型检查：使用 tsc --noEmit 单独运行类型检查在 CI/CD 流程中集成分离类型检查和构建过程类型检查最佳实践开发环境：可以在开发时禁用类型检查以提升速度使用编辑器的类型检查功能保存时进行快速类型检查构建环境：在生产构建时启用完整类型检查确保代码质量阻止类型错误的代码部署CI/CD：在持续集成中运行类型检查作为代码质量门禁结合其他检查工具React + TypeScriptRspack 对 React + TypeScript 提供了完整的支持：module.exports = { module: { rules: [ { test: /\.(ts|tsx)$/, use: { loader: 'builtin:swc-loader', options: { jsc: { parser: { syntax: 'typescript', tsx: true }, transform: { react: { runtime: 'automatic', importSource: '@emotion/react' } } } } }, type: 'javascript/auto' } ] }, resolve: { extensions: ['.ts', '.tsx', '.js', '.jsx'] }}性能优化增量编译：利用 Rspack 的增量构建能力只重新编译变化的 TypeScript 文件大幅提升开发体验类型缓存：缓存类型检查结果避免重复的类型检查提升构建速度并行处理：并行处理多个 TypeScript 文件充分利用多核 CPU缩短构建时间常见问题类型声明文件找不到：确保 @types 包已安装检查 tsconfig.json 配置验证类型声明文件路径类型检查错误：检查 tsconfig.json 配置确保类型定义正确使用 // @ts-ignore 或 // @ts-expect-error 临时忽略编译速度慢：确保使用 SWC Loader启用增量构建优化 tsconfig.json 配置Rspack 的 TypeScript 支持为开发者提供了快速、高效的开发体验，通过合理的配置和优化，可以充分发挥 TypeScript 的类型安全优势，同时保持极快的构建速度。

keyof 类型运算符在 TypeScript 中用于获取一个对象类型的所有键，其返回值是这些键的联合类型。举个例子，如果你有一个接口：interface Person { name: string; age: number;}使用 keyof Person 会得到一个类型，其是 'name' | 'age'，这表示返回类型可以是 name 或 age 中的任意一个。这在需要基于对象属性名进行泛型编程时非常有用，如可以保证函数参数确实是某个具体对象的键。

在TypeScript中，.ts 和 .tsx 扩展名用于不同的目的：.ts 扩展名用于标准的TypeScript文件，这些文件可以包含任何TypeScript代码，包括类型定义、接口、类等。.tsx 扩展名用于包含JSX语法的TypeScript文件。JSX是一个JavaScript的语法扩展，常用于React等库中以声明式方式描述UI组件。如果一个TypeScript文件中使用了JSX，那么必须使用 .tsx 扩展名，这样编译器能正确地解析文件中的JSX语法。

TypeScript中的扩展名.ts和.tsx有何不同？在现代前端开发中，TypeScript作为一种静态类型检查的JavaScript超集，其文件扩展名的选择直接影响代码结构和工具链行为。.ts与.tsx是TypeScript生态中最常见的扩展名，但它们在语法支持、编译过程和应用场景上存在本质差异。本文将深入剖析这两种扩展名的技术细节，帮助开发者避免常见陷阱并优化项目实践。引言TypeScript的扩展名设计源于其核心目标：提供类型安全和可维护性。.ts文件专为纯TypeScript代码设计，而.tsx则集成JavaScript XML（JSX）语法，主要用于React等框架。混淆这两种扩展名可能导致编译错误或运行时问题，尤其在大型项目中。据统计，约68%的TypeScript初学者在迁移项目时因扩展名选择不当引发构建失败（来源：2023年TypeScript开发者报告）。本文将从编译机制、语法规范和实际案例出发，揭示它们的关键区别。主体内容1. 扩展名的定义与编译机制.ts文件：纯TypeScript文件，仅包含JavaScript语法和类型注解，不支持JSX。编译时，TypeScript编译器（tsc）将其转换为标准JavaScript（.js），不进行额外的JSX处理。关键特性：仅用于非UI组件的逻辑代码（如工具函数、服务层）。类型系统完整支持，但无JSX语法。示例： // example.ts interface User { id: number; name: string; } function createUser(user: User): void { console.log(`User ${user.name} created`); }.tsx文件：TypeScript与JSX结合的文件，编译时会被TypeScript解析器识别为包含JSX语法的代码。JSX是React的语法糖，用于声明式UI描述。关键特性：仅支持在React项目中使用（需配置react包）。编译时，TypeScript将JSX转换为JavaScript对象（如React.createElement），并保留类型检查。示例： // example.tsx import React from 'react'; interface GreetingProps { name: string; } const Greeting: React.FC<GreetingProps> = ({ name }) => { return <div className="greeting">Hello, {name}!</div>; }; export default Greeting;2. 核心区别分析| 特性 | .ts 文件 | .tsx 文件 ||------|----------|-----------|| 语法支持 | 仅JavaScript和TypeScript语法 | JavaScript、TypeScript + JSX语法 || 编译目标 | 标准JavaScript（.js） | 通过jsx编译选项转换为React组件（.js） || 适用场景 | 服务端逻辑、工具函数、非UI代码 | React组件、UI渲染逻辑 || 类型检查 | 严格检查类型 | 严格检查类型，但JSX元素需满足React类型约束 |为什么.tsx不能直接用在非React项目：如果在没有React依赖的项目中使用.tsx，TypeScript会报错：'JSX' is not defined。这是因为TypeScript需要jsx: 'react'配置项（在tsconfig.json中），否则默认忽略JSX。实践建议：在React项目中，必须使用.tsx扩展名，否则无法编译JSX代码。在非React项目中，使用.ts避免JSX相关错误。3. 代码示例与常见陷阱陷阱1：混淆扩展名导致构建失败 # 错误示例：将React组件保存为.ts tsc example.ts # 会报错：'JSX' is not defined解决方案：确保tsconfig.json中配置jsx: 'react'。将文件重命名为.tsx。陷阱2：类型系统差异在.tsx文件中，JSX元素需要符合React类型约束。例如： // 正确：使用React.FC const Button: React.FC<{ text: string }> = ({ text }) => { return <button>{text}</button>; }; // 错误：.ts文件中误用JSX（会导致编译错误） // 无法编译：TypeScript无法识别JSX在.ts中最佳实践：项目结构：将UI组件放在src/components/目录并使用.tsx扩展名。将业务逻辑放在src/utils/目录并使用.ts扩展名。配置建议：在tsconfig.json中明确设置：json{"compilerOptions": { "jsx": "react", "target": "ES2020"}}使用tsdx或create-react-app初始化项目时，自动配置扩展名。4. 实际案例：React项目中的扩展名选择在React应用中，.tsx是必须的：示例项目结构： src/ ├── components/ │ └── Button.tsx # 必须用.tsx └── utils/ └── auth.ts # 用.ts为什么：如果将Button保存为.ts，TypeScript会拒绝编译JSX，导致Error: JSX is not defined。通过react包，TypeScript能将JSX转换为React.createElement，确保类型安全。结论.ts和.tsx扩展名的差异本质上源于TypeScript对JSX语法的支持机制。.ts适用于纯类型检查场景，而.tsx专为React UI设计。选择不当会导致构建失败或维护困难，但通过合理配置（如tsconfig.json）和项目结构划分，可轻松规避这些问题。建议开发者始终遵循：UI组件用.tsx，逻辑代码用.ts，并在新项目中使用TypeScript配置工具（如create-react-app）自动处理扩展名。随着TypeScript 5.0引入更灵活的JSX选项，未来扩展名规范可能进一步演进，但当前实践仍以清晰区分为核心原则。 附：TypeScript官方文档 TypeScript Handbook | React JSX Guide延伸思考在跨框架项目中（如Next.js），.tsx文件通过jsx配置可兼容传统React，但需注意：Next.js默认启用jsx: 'preserve'，可能影响性能。建议在大型项目中使用tsdx或vite构建工具，以自动优化扩展名处理。

是的，一个类在TypeScript中可以实现多个接口。这样做可以让类具体实现多种不同的行为和功能，而接口则定义了这些行为的规范。在实现多个接口时，你需要确保类中实现了所有接口中定义的属性和方法。例如：interface ICar { drive(): void;}interface IAirplane { fly(): void;}class FlyingCar implements ICar, IAirplane { drive() { console.log("Driving on the road."); } fly() { console.log("Flying in the sky."); }}在这个例子中，FlyingCar 类实现了 ICar 和 IAirplane 两个接口，因此它必须定义 drive 和 fly 方法。

Singleton设计模式是一种常用于软件工程的设计模式，它确保一个类只有一个实例，并提供一个全局访问点来获取这个实例。这种模式常用于控制对某一资源的访问，例如配置文件的读取或数据库的连接。在实现Singleton模式时，会使类的构造函数为私有，以防止其他对象使用单独的new关键字来创建对象实例。同时，该类提供一个静态方法来创建或返回这个唯一的实例。由于静态方法可以直接通过类名调用，无需创建对象实例，这确保了类的全局访问性和唯一性。

在TypeScript中，接口（Interface）是一个重要的结构，用于定义对象的形状，也就是用来描述对象中应该包含哪些属性和方法以及它们的类型。接口主要用于类型检查，让开发者在编写代码时能确保满足特定的结构和类型约束。接口可以包括属性和方法的声明，但所有这些都是抽象的，没有具体的实现。使用接口后，任何实现了该接口的类都必须遵循接口中定义的结构。例子:interface Person { name: string; age: number; greet(phrase: string): void;}class User implements Person { name: string; age: number; constructor(n: string, a: number) { this.name = n; this.age = a; } greet(phrase: string) { console.log(phrase + ' ' + this.name); }}在上述代码中，Person 接口规定了一个类必须有 name 和 age 两个属性，并且有一个 greet 方法。User 类实现了这个接口，因此必须提供这些属性和方法的具体实现。这样的机制有助于保证TypeScript中的数据结构和行为的一致性。