首页 教程 常见问题

3.1 代码生成与优化

代码生成的核心原则

Claude Code 生成代码的质量很大程度上取决于你提供的提示词质量。掌握以下几个原则,可以显著提升生成效果:

具体化(Be Specific)

模糊的指令会导致不理想的代码。好的指令应该包含:

效果差: "写一个排序函数"
效果好: "在 src/utils/sort.ts 中添加一个快速排序函数,输入是 number 数组,输出排序后的数组,支持升序和降序两种模式,用参数 desc?: boolean 控制"

引用现有模式(Reference Existing Patterns)

让 Claude 参考项目中已有的代码风格:

"参考 src/components/Button.tsx 的实现方式,在 src/components/ 下创建 Card.tsx 组件"

这样 Claude 会保持一致的代码风格、命名规范和结构。

提供验证方式(Provide Verification)

告诉 Claude 如何验证代码是否正确:

"写完这个函数后,运行 npm test -- --grep sort 验证" 或 "确保在浏览器中打开 /dashboard 时不报 console 错误"

常用代码生成场景

生成代码片段

在 src/utils/format.ts 中添加一个日期格式化函数,
输入 Date 对象,输出格式如 '2024-01-15 14:30' 的字符串。
参考同文件中现有函数的风格。

生成完整模块

在 src/api/ 下创建一个用户认证模块,包含:
- login(username, password) 登录函数
- logout() 登出函数
- getCurrentUser() 获取当前用户信息
使用 Fetch API,参考同目录下 auth.ts 的错误处理方式。

添加测试用例

为 src/utils/format.ts 中的日期格式化函数编写单元测试,
覆盖:正常日期、null 输入、undefined 输入、跨年边界。
测试框架使用 Jest,参考 __tests__/format.test.ts 的写法。

代码优化

Claude Code 也可以帮你优化现有代码:

性能优化

分析 src/utils/heavy.ts 中的 calculate() 函数,
找出性能瓶颈并给出优化建议。
特别关注循环和递归调用。

代码可读性优化

简化 src/components/OldWidget.tsx 的 JSX 结构,
提取重复的 JSX 为子组件,保持功能不变。

类型安全增强

将 src/utils/data.ts 中的 any 类型全部替换为具体类型,
定义必要的接口和类型别名。

上下文管理与 Token 优化

当项目较大或对话较长时,Claude 的上下文会逐渐填满。可以使用以下方式管理:

命令作用
/context显示当前 Token 使用详情,按类别分解,给出优化建议
/compact压缩对话历史,保留关键信息,释放 Token 空间
/clear清除当前对话,从头开始新会话

减少上下文消耗的习惯

典型工作流示例

cd /path/to/project
claude

# 1. 了解项目
→ 给我一个项目结构概览

# 2. 理解特定模块
→ 解释 src/utils/auth.js 的逻辑

# 3. 生成或修改代码
→ 在 src/utils/ 中添加一个 JWT 刷新函数

# 4. 运行验证
→ 运行 npm test 确认没有破坏现有功能

# 5. 提交变更
→ 用一个有意义的 commit 信息提交这些修改

限制与注意事项