Prompt工程入门 · 第6专栏：代码审查实战

学了3个框架，看真实场景如何应用，从2小时到10分钟

本专栏目标：通过真实案例，掌握代码审查的AI应用方法

---

---

真实案例背景

代码审查是什么？ 就像编辑审稿，检查文章是否有错别字、逻辑问题、语法错误。代码审查就是检查代码是否有bug、性能问题、安全隐患。

项目情况

某电商平台用户模块代码审查：

• 代码量：约800行
• 技术栈：React + TypeScript
• 功能：用户注册、登录、个人信息管理
• 审查频率：每周2次，每次2-3个PR（PR是Pull Request的缩写，就是代码提交请求的意思）

传统审查流程的问题

---

Before：传统审查流程

步骤拆解

第1步：逐行阅读代码
  ↓
耗时：30分钟
  ↓
第2步：手动查找问题（bug、性能、规范）
  ↓
耗时：40分钟
  ↓
第3步：整理问题清单
  ↓
耗时：20分钟
  ↓
第4步：写审查意见
  ↓
耗时：20分钟
  ↓
总计：2小时

实际问题

某次审查的真实反馈：

审查员A：发现3个问题
审查员B：发现5个问题
（只有1个重复）

合并后发现：实际有10个问题
遗漏率：约40%

---

After：AI辅助审查流程

步骤拆解

第1步：准备Prompt模板
  ↓
耗时：2分钟
  ↓
第2步：AI自动审查
  ↓
耗时：3分钟
  ↓
第3步：人工复核AI结果
  ↓
耗时：3分钟
  ↓
第4步：补充AI遗漏的部分
  ↓
耗时：2分钟
  ↓
总计：10分钟

效果对比

---

核心Prompt模板

完整模板（C.O.R.E框架）

【Context】
这是React + TypeScript项目中的用户注册组件，
项目处于开发阶段，团队遵循Airbnb代码规范。

【Objective】
请对这段代码进行全面审查，找出所有潜在问题。

【Requirements】
重点关注以下四个维度：
1. 代码质量：命名、注释、结构
2. 性能问题：不必要的渲染、内存泄漏
3. 安全隐患：XSS跨站脚本攻击（坏人通过网页注入恶意代码）、注入攻击（恶意代码注入）、数据验证
4. 可维护性：代码复用、耦合度

【Output】
请用表格形式输出：
| 位置 | 问题描述 | 严重程度 | 修复建议 |
|------|----------|----------|----------|
| ... | ... | 高/中/低 | ... |

严重程度说明：
- 高：必须修复，影响功能或安全
- 中：建议修复，影响代码质量
- 低：可选修复，优化建议

---

实战演示

待审查代码（简化版）

function UserRegister() {
  const [formData, setFormData] = useState({
    email: '',
    password: '',
    confirmPassword: ''
  })

  const handleSubmit = () => {
    // 提交逻辑
    fetch('/api/register', {
      method: 'POST',
      body: JSON.stringify(formData)
    })
  }

  return (
    <form onSubmit={handleSubmit}>
      <input type="text" value={formData.email} onChange={e =>
        setFormData({...formData, email: e.target.value})
      } />
      <input type="password" value={formData.password} onChange={e =>
        setFormData({...formData, password: e.target.value})
      } />
      <button type="submit">注册</button>
    </form>
  )
}

AI审查结果（示例）

人工补充（AI遗漏的）

---

实战经验总结

1. Prompt模板化

建立不同场景的模板：

# 通用代码审查模板
【C】[项目背景]
【O】全面审查代码
【R】质量、性能、安全、可维护性
【E】表格输出问题清单

# 性能专项审查模板
【C】[模块说明]
【O】性能问题诊断
【R】渲染、计算、内存、网络
【E】性能优化建议

# 安全专项审查模板
【C】[用户输入相关代码]
【O】安全隐患检查
【R】注入、XSS、CSRF、越权
【E】安全问题清单和修复方案

2. 多轮审查策略

第1轮：AI自动审查（全面检查）
  ↓
第2轮：人工复核（确认问题）
  ↓
第3轮：针对性深入（复杂问题）

3. 团队协作流程

开发者提交PR
  ↓
AI预审查（2分钟）
  ↓
生成审查清单
  ↓
人工审查（5分钟）
  ↓
确认/补充
  ↓
反馈给开发者

---

常见问题解决

Q1：AI会遗漏问题吗？

A：会，所以需要人工复核。

经验数据：

• AI能发现：85-90%的问题
• 人工补充：10-15%
• 总体遗漏率：约3%（传统15%）

Q2：AI审查会不会误报？

A：偶尔会，需要人工判断。

处理方法：

• 设置置信度阈值
• 标注"需确认"的问题
• 人工二次验证

Q3：如何提高AI审查准确性？

A：3个要点

1. 上下文完整：提供足够的代码和背景
2. 要求明确：清晰列出审查维度
3. 输出结构化：表格形式便于复核

---

进阶技巧

1. 结合R.A.C.E.S框架

R: 你是代码审查专家，10年经验

A: 审查这段React组件代码

C: 电商用户模块，React 18 + TypeScript

E: 重点关注性能和安全性

S: 专业术语，直接指出问题，附修复代码

2. 使用示例驱动

参考以下格式输出问题：

### 问题1：[标题]
**位置**：line X
**严重程度**：高
**问题描述**：...
**修复代码**：
```typescript
// 修复后的代码

### 3. 迭代优化

第1轮：全面审查 ↓ 第2轮："请深入分析性能问题" ↓ 第3轮："给出具体的优化代码"

---

## 你能做到的！

**学完本专栏，你可以立即：**
- 🎯 将代码审查时间从2小时缩短到10分钟
- ✨ 减少80%的问题遗漏率
- ⚡ 建立高效的团队审查流程！

马上来练习巩固吧！

---

## 本专栏练习

### 练习题

以下是一个函数，用今天学的方法写一个审查Prompt：

```javascript
function processUserData(users) {
  let result = []
  for (let i = 0; i < users.length; i++) {
    let user = users[i]
    if (user.age > 18) {
      result.push({
        name: user.name,
        email: user.email,
        age: user.age
      })
    }
  }
  return result
}

参考答案

【Context】
这是JavaScript数据处理函数，用于用户列表过滤

【Objective】
请审查这段代码，找出可以优化的地方

【Requirements】
重点关注：
1. 性能优化
2. 代码简洁性
3. 边界情况处理

【Output】
用表格列出：| 问题 | 优化建议 | 优化代码 |

---

本专栏小结

学完后你应该：

✅ 了解代码审查的AI应用方法 ✅ 掌握完整的Prompt模板 ✅ 知道如何建立团队审查流程

核心要点

1. 模板化：建立场景模板，复用高效
2. 结构化：用C.O.R.E框架，输出规范
3. 人机协作：AI初筛，人工复核，效率倍增

下节专栏预告

第7专栏：AI辅助重构

不只是审查，看AI如何帮助完成完整的代码重构！

---

在分享：

1. 你的代码审查流程是怎样的？
2. 愿意尝试AI辅助审查吗？

优质会在下一篇文章中展示！

💡 限时提醒：完整系统技术分享将于1月10日上线，预售价¥99（原价¥149），仅限前100名！想系统学习8种框架的同学不要错过~

---

本套技术分享完整示例代码及扩充专栏件：https://github.com/MaesHughes/wuxing-blog-comments 技术分享仓库：introduction-prompt/ 作者：大熊掌门 | 全平台搜索"大熊掌门"关注更多内容