---
title: "A.2 代码修改类模板"
---


![03-technique_appendix_A.2-code-modification.png](/images/Basic/03-technique_appendix_A.2-code-modification.png)
# A.2 代码修改类模板

本节提供修改现有代码的 Prompt 模板，包括功能扩展、代码重构、性能优化和样式调整。


## 模板一：功能扩展

适用于：在现有代码基础上添加新功能

```markdown
## 当前状态

**项目背景**：[简述项目是做什么的]
**技术栈**：[使用的技术]
**要扩展的模块**：[哪个文件/组件]

## 现有代码

```[语言]
[粘贴现有代码]
```

## 扩展需求

**新增功能**：[描述要添加什么功能]

**功能细节**：
- [细节1]
- [细节2]
- [细节3]

**触发方式**：[用户如何触发这个功能]
**预期结果**：[功能执行后应该发生什么]

## 约束条件

**必须保持**：
- [现有功能A 不能受影响]
- [现有功能B 要继续正常工作]

**不要改动**：
- [不要修改的部分1]
- [不要修改的部分2]

## 输出要求

- [ ] 只输出修改后的代码，不需要重复未修改的部分
- [ ] 用注释标注新增的代码
- [ ] 说明需要额外安装的依赖（如有）
```

### 填写示例：待办清单添加"撤销删除"功能

```markdown
## 当前状态

**项目背景**：个人待办清单网页应用
**技术栈**：React + TypeScript + Tailwind CSS
**要扩展的模块**：TaskList.tsx 组件

## 现有代码

```tsx
function TaskList({ tasks, onDelete }) {
  return (
    <ul>
      {tasks.map(task => (
        <li key={task.id}>
          {task.content}
          <button onClick={() => onDelete(task.id)}>删除</button>
        </li>
      ))}
    </ul>
  );
}
```

## 扩展需求

**新增功能**：删除任务后显示"撤销"提示，3 秒内可恢复

**功能细节**：
- 删除任务后，底部显示"已删除，点击撤销"提示
- 提示显示 3 秒后自动消失
- 点击"撤销"按钮，任务恢复到原位置
- 同时只能有一个撤销提示

**触发方式**：用户点击删除按钮
**预期结果**：任务从列表消失，底部出现撤销提示

## 约束条件

**必须保持**：
- 现有的任务展示逻辑不变
- 删除按钮的位置和样式不变

**不要改动**：
- 不要改变 props 的类型定义
- 不要引入新的状态管理库

## 输出要求

- [x] 只输出修改后的代码
- [x] 用注释标注新增的代码
- [ ] 说明需要额外安装的依赖
```


## 模板二：代码重构

适用于：改进代码质量、提高可读性、统一代码风格

```markdown
## 重构目标

**当前问题**：[代码现在有什么问题]
**期望改进**：[重构后希望达到什么效果]

## 待重构代码

```[语言]
[粘贴需要重构的代码]
```

## 重构要求

**方向**：[可多选]
- [ ] 提高可读性（变量命名、函数拆分）
- [ ] 减少重复代码（提取公共函数）
- [ ] 统一代码风格
- [ ] 添加类型定义（TypeScript）
- [ ] 改进错误处理
- [ ] 其他：[具体说明]

**必须保持**：
- 功能行为完全不变
- [其他约束]

**参考规范**（可选）：
[如果有特定的代码规范，可以贴在这里]

## 输出要求

请提供：
1. 重构后的完整代码
2. 简要说明做了哪些改动
3. 改动的理由
```

### 填写示例：重构重复的表单验证代码

```markdown
## 重构目标

**当前问题**：注册、登录、修改密码三个表单都有类似的验证代码，复制粘贴了三遍
**期望改进**：提取公共的验证函数，减少重复

## 待重构代码

```typescript
// 注册表单
function validateRegister(data) {
  if (!data.email || !data.email.includes('@')) {
    return '邮箱格式不正确';
  }
  if (!data.password || data.password.length < 8) {
    return '密码至少8位';
  }
  if (data.password !== data.confirmPassword) {
    return '两次密码不一致';
  }
  return null;
}

// 登录表单
function validateLogin(data) {
  if (!data.email || !data.email.includes('@')) {
    return '邮箱格式不正确';
  }
  if (!data.password || data.password.length < 8) {
    return '密码至少8位';
  }
  return null;
}

// 修改密码表单
function validateChangePassword(data) {
  if (!data.oldPassword || data.oldPassword.length < 8) {
    return '旧密码至少8位';
  }
  if (!data.newPassword || data.newPassword.length < 8) {
    return '新密码至少8位';
  }
  if (data.newPassword !== data.confirmPassword) {
    return '两次密码不一致';
  }
  return null;
}
```

## 重构要求

**方向**：
- [x] 减少重复代码（提取公共函数）
- [x] 添加类型定义（TypeScript）
- [x] 改进错误处理（支持返回多个错误）

**必须保持**：
- 功能行为完全不变
- 错误信息文案保持一致

## 输出要求

请提供：
1. 重构后的完整代码
2. 简要说明做了哪些改动
3. 如何在原有表单中使用新的验证函数
```


## 模板三：性能优化

适用于：页面加载慢、操作卡顿、内存占用高

```markdown
## 性能问题描述

**问题现象**：[具体描述慢在哪里、卡在哪里]
**触发条件**：[什么情况下会出现这个问题]
**影响程度**：[大概延迟多久、卡顿多久]

## 相关代码

```[语言]
[粘贴可能导致性能问题的代码]
```

## 优化目标

**期望效果**：[优化后应该达到什么程度]
**度量标准**：[如何判断优化成功]

## 已知信息

**数据规模**：[处理的数据量大概多少]
**运行环境**：[浏览器/Node.js/移动端]
**已尝试的优化**：[如果有的话]

## 约束条件

- 功能逻辑不能改变
- [其他约束]

## 输出要求

请提供：
1. 优化后的代码
2. 解释性能问题的原因
3. 优化的原理和效果预估
```


## 模板四：样式调整

适用于：UI 美化、布局修改、响应式适配

```markdown
## 当前样式

**问题描述**：[当前界面哪里不满意]

**当前代码**：
```[css/html]
[粘贴当前样式相关代码]
```

## 期望效果

**描述**：[用文字描述想要的效果]

**参考**（可选）：
- 参考网站：[URL]
- 参考图片：[描述或链接]
- 关键词：[简洁/现代/圆角/阴影/渐变/...]

## 具体要求

**布局调整**：
- [调整1]
- [调整2]

**视觉效果**：
- [效果1]
- [效果2]

**响应式**：
- 桌面端（>1024px）：[要求]
- 平板端（768-1024px）：[要求]
- 手机端（<768px）：[要求]

## 技术约束

**使用技术**：[Tailwind CSS/原生 CSS/其他]
**必须兼容**：[浏览器版本要求]

## 输出要求

请提供修改后的样式代码，并标注改动的部分。
```


## 模板五：代码迁移（精简版）

适用于：升级框架版本、更换技术栈

```markdown
## 迁移需求

**原技术**：[如 React Class 组件]
**目标技术**：[如 React Hooks 函数组件]

## 原代码

```[语言]
[粘贴需要迁移的代码]
```

## 迁移要求

- 保持功能完全一致
- 遵循目标技术的最佳实践
- [其他要求]

## 输出要求

请提供迁移后的代码，并说明主要改动点。
```


## 精简版：快速修改模板

当你只需要做一个小改动时，可以使用这个精简版：

```markdown
请修改以下代码：

```[语言]
[代码]
```

**修改内容**：[简述要改什么]

**约束**：
- 保持其他部分不变
- [其他约束]
```


## 常见填写误区

| 误区 | 问题 | 正确做法 |
|-----|------|---------|
| 不贴现有代码 | AI 无法了解上下文 | 贴出相关的代码片段 |
| 只说"优化一下" | 不知道优化什么方向 | 明确是可读性/性能/结构 |
| 忘记说"不要改" | AI 可能重构整个文件 | 明确边界，哪些不动 |
| 参考描述太抽象 | "好看一点"太模糊 | 给参考网站或具体描述 |


## 本节要点

- ✅ **功能扩展**：贴出现有代码 + 描述新功能 + 明确不能动的部分
- ✅ **代码重构**：明确重构方向 + 保证功能不变
- ✅ **性能优化**：描述问题现象 + 给出数据规模 + 设定度量标准
- ✅ **样式调整**：提供参考 + 具体描述期望效果