TypeScript 中的 Clean Code：面向开发者的原则与示例

轻松学习Python，无需理论负担。在浏览器中直接解决带自动检查的实践任务，无需安装任何东西。

TypeScript 中的 Clean Code：如何编写拿得出手的代码

Clean Code（整洁代码）不仅仅是一个流行术语，更是一种基础性的开发方法，它将混乱的指令集转变为可理解且可维护的系统。对于 TypeScript 这种静态类型语言来说，整洁代码的原则尤为重要：严格的类型系统和强大的编译器工具可以在开发阶段发现错误，但前提是代码结构正确。在本文中，我们将结合具体示例，分析 Clean Code 在 TypeScript 中的关键原则。

1. 变量、函数和类的命名

变量或函数的名称应该回答“这是什么？”或“它做什么？”的问题。在 TypeScript 中，得益于类型系统，名称可以变得更加信息丰富。避免使用单个字母的名称（循环索引除外）以及只有你自己能理解的缩写。

// 不好const d = new Date();const fn = (a: number, b: number) => a + b;

// 好const currentDate = new Date();const sum = (firstNumber: number, secondNumber: number): number => firstNumber + secondNumber;

类使用名词，函数使用动词或动词短语。布尔变量应以 is、has、should 开头。

// 不好const flag = true;function validate() { /* ... */ }

// 好const isUserActive = true;function validateEmail(email: string): boolean { /* ... */ }

2. 函数的单一职责原则 (SRP)

每个函数应该只做一件事，并且把它做好。如果函数执行多个操作，请将其拆分为更小的函数。TypeScript 允许严格定义输入和输出数据的类型，这简化了重构过程。

// 不好：函数查找用户、检查密码并发送邮件async function loginUser(email: string, password: string): Promise<void> {    const user = await findUserByEmail(email);    if (user && user.password === password) {        await sendLoginEmail(user.email);        console.log('Login successful');    }}

// 好：分离职责async function findUserByEmail(email: string): Promise<User | null> { /* ... */ }function isPasswordValid(inputPassword: string, storedHash: string): boolean { /* ... */ }async function notifyUserLogin(email: string): Promise<void> { /* ... */ }

async function loginUser(email: string, password: string): Promise<boolean> {    const user = await findUserByEmail(email);    if (!user || !isPasswordValid(password, user.passwordHash)) {        return false;    }    await notifyUserLogin(user.email);    return true;}

3. 使用类型和接口代替 any

TypeScript 的主要特性之一是其类型系统。不惜一切代价避免使用 any。如果类型事先未知，请使用 unknown、generics 或联合类型。这使代码具有自文档性并防止错误。

// 不好function getData(id: any): any {    return fetch(`/api/${id}`);}

// 好interface ApiResponse<T> {    data: T;    error?: string;}

async function getData<T>(id: string): Promise<ApiResponse<T>> {    const response = await fetch(`/api/${id}`);    return response.json();}

使用严格的接口来描述对象结构。这简化了重构，并帮助 IDE 提示属性。

interface User {    readonly id: number;    name: string;    email: string;    role: 'admin' | 'user';}

function updateUserName(user: User, newName: string): User {    return { ...user, name: newName };}