从平凡到卓越：如何在重复工作中找到激情

从平凡到卓越：如何在重复工作中找到激情

真实故事：那个让我差点辞职的下午

2021年3月某日下午3点，我盯着电脑屏幕，第100次写下同样的代码：

// 用户列表
async function getUsers() {
  const response = await fetch('/api/users');
  return response.json();
}

// 用户详情
async function getUser(id) {
  const response = await fetch(`/api/users/${id}`);
  return response.json();
}

// 创建用户
async function createUser(data) {
  const response = await fetch('/api/users', {
    method: 'POST',
    body: JSON.stringify(data)
  });
  return response.json();
}

// 更新用户
async function updateUser(id, data) {
  const response = await fetch(`/api/users/${id}`, {
    method: 'PUT',
    body: JSON.stringify(data)
  });
  return response.json();
}

// 删除用户
async function deleteUser(id) {
  const response = await fetch(`/api/users/${id}`, {
    method: 'DELETE'
  });
  return response.json();
}

这就是我工作的第3个月。每天重复写CRUD（增删改查）代码，感觉自己像个代码机器。

那一刻，我真的想辞职了。

但3年后，我成为了团队的技术负责人。回顾这3年，我发现了:重复工作不是成长的敌人，而是卓越的阶梯。

第一部分：识别重复工作的困境

1.1 程序员最常见的5种重复工作

场景1：CRUD疲劳

// 第1个模块：用户管理
const UserAPI = {
  list: () => fetch('/api/users').then(r => r.json()),
  get: (id) => fetch(`/api/users/${id}`).then(r => r.json()),
  create: (data) => fetch('/api/users', {method: 'POST', body: JSON.stringify(data)}).then(r => r.json()),
  update: (id, data) => fetch(`/api/users/${id}`, {method: 'PUT', body: JSON.stringify(data)}).then(r => r.json()),
  delete: (id) => fetch(`/api/users/${id}`, {method: 'DELETE'}).then(r => r.json())
};

// 第2个模块：产品管理（完全一样的代码！）
const ProductAPI = {
  list: () => fetch('/api/products').then(r => r.json()),
  get: (id) => fetch(`/api/products/${id}`).then(r => r.json()),
  create: (data) => fetch('/api/products', {method: 'POST', body: JSON.stringify(data)}).then(r => r.json()),
  update: (id, data) => fetch(`/api/products/${id}`, {method: 'PUT', body: JSON.stringify(data)}).then(r => r.json()),
  delete: (id) => fetch(`/api/products/${id}`, {method: 'DELETE'}).then(r => r.json())
};

// 第3个模块：订单管理（还是一样的代码！）
const OrderAPI = {
  list: () => fetch('/api/orders').then(r => r.json()),
  get: (id) => fetch(`/api/orders/${id}`).then(r => r.json()),
  create: (data) => fetch('/api/orders', {method: 'POST', body: JSON.stringify(data)}).then(r => r.json()),
  update: (id, data) => fetch(`/api/orders/${id}`, {method: 'PUT', body: JSON.stringify(data)}).then(r => r.json()),
  delete: (id) => fetch(`/api/orders/${id}`, {method: 'DELETE'}).then(r => r.json())
};

问题：10个模块，10套重复代码，10倍的时间浪费。

场景2：Bug修复循环

# 周一：修复Bug #1234
修改：user.js 第45行
测试：通过
发布

周三：Bug #1235（和#1234一样的错误）
修改：product.js 第67行（同样的代码）
测试：通过
发布

周五：Bug #1236（还是一样的错误）
修改：order.js 第89行（又是同样的代码）
测试：通过
发布

问题：同样的问题重复出现，每次都是”临时修复”，没有从根本上解决。

场景3：代码审查重复

// 每次Code Review都看到的注释：
// TODO: 需要优化
// FIXME: 这里有个bug
// HACK: 临时方案

// 每次都指出的问题：
// - 变量命名不规范
// - 没有错误处理
// - 没有注释
// - 代码重复

问题：同样的问题重复出现，但没有改进。

场景4：文档重复

# 用户模块文档
功能说明
用户模块包括用户列表、用户详情、创建用户、更新用户、删除用户。

API接口

GET /api/users - 获取用户列表
GET /api/users/:id - 获取用户详情
POST /api/users - 创建用户
PUT /api/users/:id - 更新用户
DELETE /api/users/:id - 删除用户


产品模块文档（完全一样的结构！）
功能说明
产品模块包括产品列表、产品详情、创建产品、更新产品、删除产品。

API接口

GET /api/products - 获取产品列表
GET /api/products/:id - 获取产品详情
POST /api/products - 创建产品
PUT /api/products/:id - 更新产品
DELETE /api/products/:id - 删除产品

问题：文档模板化，但缺乏实际内容，用户看不懂，也用不上。

场景5：会议重复

# 每周站会

上周完成了什么？（重复汇报）
这周计划做什么？（重复计划）
遇到什么问题？（同样的问题重复出现）


每周代码审查会

审查了哪些PR？（重复列表）
发现了什么问题？（同样的问题）
下周如何改进？（同样的计划，没有执行）

问题：会议没有实质内容，浪费时间。

1.2 重复工作的3个阶段

阶段1：无意识重复

• 特点：不知道自己在重复
• 表现：每次都从头开始
• 时间：0-6个月（新手期）

阶段2：有意识重复

• 特点：意识到重复，但不知道如何改进
• 表现：心里不爽，但还是继续重复
• 时间：6个月-2年（瓶颈期）

阶段3：有意识改进

• 特点：主动寻找优化方法
• 表现：提炼模式，自动化，标准化
• 时间：2年+（成长期）

我当时处于第2阶段：意识到重复，但没有方法改进。

第二部分：在重复中找到成长的5个方法

2.1 方法1：提炼模式 – 从重复到抽象

真实案例：重构CRUD代码

第1步：发现重复

// 10个模块，10套重复代码
const UserAPI = { list, get, create, update, delete };
const ProductAPI = { list, get, create, update, delete };
const OrderAPI = { list, get, create, update, delete };
// ... 还有7个模块

第2步：抽象通用模式

// 创建通用的API工厂函数
function createAPI(resourceName) {
  return {
    list: () => fetch(`/api/${resourceName}`).then(r => r.json()),
    get: (id) => fetch(`/api/${resourceName}/${id}`).then(r => r.json()),
    create: (data) => fetch(`/api/${resourceName}`, {
      method: 'POST',
      body: JSON.stringify(data)
    }).then(r => r.json()),
    update: (id, data) => fetch(`/api/${resourceName}/${id}`, {
      method: 'PUT',
      body: JSON.stringify(data)
    }).then(r => r.json()),
    delete: (id) => fetch(`/api/${resourceName}/${id}`, {
      method: 'DELETE'
    }).then(r => r.json())
  };
}

第3步：应用到所有模块

// 一行代码创建一个API
const UserAPI = createAPI('users');
const ProductAPI = createAPI('products');
const OrderAPI = createAPI('orders');
// ... 10个模块，10行代码

效果：

• 代码量：500行 → 50行（减少90%）
• 维护成本：10倍降低
• Bug修复：一次修改，所有模块受益

成长点：

• ✅ 学习了抽象思维
• ✅ 理解了工厂模式
• ✅ 提升了代码复用能力

2.2 方法2：自动化 – 从手动到脚本

真实案例：自动化部署流程

Before（手动，重复）：

# 每次部署都要执行（30分钟）
1. 本地构建
npm run build

2. 压缩文件
tar -czf dist.tar.gz dist/

3. 上传到服务器
scp dist.tar.gz user@server:/var/www/

4. SSH到服务器
ssh user@server

5. 备份旧版本
cp -r /var/www/html /var/www/html.backup

6. 解压新版本
tar -xzf /var/www/dist.tar.gz -C /var/www/html

7. 重启服务
systemctl restart nginx

8. 清理
rm /var/www/dist.tar.gz
rm -rf /var/www/html.backup

After（自动化，1分钟）：

# deploy.sh（一键部署脚本）
#!/bin/bash
set -e

echo "? 开始部署..."

本地构建
npm run build

压缩
tar -czf dist.tar.gz dist

上传并部署
scp dist.tar.gz user@server:/tmp/
ssh user@server 'bash -s' < {
    fetchUser().then(data => setUser(data));
  }, []);
  return 
{user?.name}
;
}

第3个月（出现问题）：

// Bug: 无限循环
function UserProfile() {
  const [user, setUser] = useState(null);
  useEffect(() => {
    fetchUser().then(data => setUser(data));
  }, [user]); // 依赖user，每次更新都重新fetch
  return 
{user?.name}
;
}

第6个月（深入理解）：

// 理解了Hooks原理，不再犯错
function UserProfile({userId}) {
  const [user, setUser] = useState(null);

  useEffect(() => {
    // 只在userId变化时重新fetch
    const controller = new AbortController();
    fetchUser(userId, controller.signal)
      .then(data => setUser(data))
      .catch(error => {
        if (error.name !== 'AbortError') {
          console.error('Fetch failed:', error);
        }
      });

    return () => controller.abort(); // 清理函数
  }, [userId]); // 正确的依赖

  if (!user) return 
Loading...
;
  return 
{user.name}
;
}

成长点：

• ✅ 从表面使用到深入原理
• ✅ 理解了Hooks的设计哲学
• ✅ 能够解决复杂问题

2.4 方法4：知识沉淀 – 从个人到团队

真实案例：建立团队知识库

Before（个人经验，不可复用）：

• 我知道如何解决某个问题
• 但其他人不知道
• 我请假时，问题无法解决
• 知识随人员流动而流失

After（知识库，团队共享）：

# Bug修复手册

常见问题 #1：跨域问题

现象
前端请求API时报错：

Access to fetch at ‘https://your-domain.com’ from origin ‘http://localhost:3000’ has been blocked by CORS policy

原因
浏览器的同源策略限制。

解决方案
方案1：服务器端设置CORS

javascript
// Express.js
app.use((req, res, next) => {
res.header(‘Access-Control-Allow-Origin’, ‘*’);
res.header(‘Access-Control-Allow-Headers’, ‘Content-Type’);
next();
});

方案2：开发环境代理

javascript
// vite.config.js
export default {
server: {
proxy: {
‘/api’: ‘https://your-domain.com’
}
}
};

相关文档

[MDN - CORS](https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CORS)
内部案例：项目A的解决方案




常见问题 #2：内存泄漏

现象
页面使用时间长了变慢，内存持续增长。

排查步骤
1. 打开Chrome DevTools → Memory面板
2. 拍摄Heap Snapshot
3. 使用页面30分钟
4. 再拍一张Snapshot
5. Comparison查看差异

常见原因

事件监听器没有移除
定时器没有清除
闭包引用大对象


解决方案

javascript
// Before（泄漏）
class Component {
componentDidMount() {
window.addEventListener(‘scroll’, this.handleScroll);
}
}

// After（正确）
class Component {
componentDidMount() {
this.handleScroll = () => this.update();
window.addEventListener(‘scroll’, this.handleScroll);
}

componentWillUnmount() {
window.removeEventListener(‘scroll’, this.handleScroll);
}
}

效果：

• 新人上手时间：2周 → 3天
• 重复问题减少：80%
• 团队整体效率提升：50%

成长点：

• ✅ 从个人经验到团队知识
• ✅ 提升了文档能力
• ✅ 建立了可复用的知识体系

2.5 方法5：刻意练习 – 从熟练到精通

真实案例：Code Review刻意练习

Week 1-2：发现问题

• 每次Review都列出10个问题
• 但问题重复出现
• 没有改进

Week 3-4：建立Checklist

# Code Review Checklist

必查项（必须通过）

[ ] 变量命名符合规范
[ ] 函数单一职责
[ ] 有错误处理
[ ] 有必要的注释
[ ] 没有console.log


可查项（建议通过）

[ ] 代码复用性
[ ] 性能优化
[ ] 可读性
[ ] 测试覆盖

Week 5-8：量化改进

• Week 5: 平均每PR 15个问题
• Week 6: 平均每PR 10个问题（使用Checklist后）
• Week 7: 平均每PR 5个问题（团队培训后）
• Week 8: 平均每PR 2个问题（持续改进）

效果：

• Code Review时间：30分钟 → 10分钟
• 代码质量：显著提升
• 团队成长：明显加速

成长点：

• ✅ 从凭感觉到量化
• ✅ 建立了标准流程
• ✅ 提升了团队协作能力

第三部分：心态转变的3个关键

3.1 从”被动执行”到”主动优化”

被动执行（D级心态）：

产品经理："实现用户管理功能。"
我："好的。"（开始写CRUD代码）

产品经理："实现产品管理功能。"
我："好的。"（又开始写同样的CRUD代码）

产品经理："实现订单管理功能。"
我："好的。"（还在写同样的CRUD代码）

主动优化（A级心态）：

产品经理："实现用户管理功能。"
我："好的。但我发现这和产品、订单管理都是CRUD，我可以创建一个通用的CRUD框架，这样后续的开发速度会提升10倍。"

产品经理："太好了！那就这么办。"

我：（创建通用框架，文档化，培训团队）

转变关键：

• ❌ 不要只是执行命令
• ✅ 主动思考如何优化
• ✅ 提出更好的解决方案
• ✅ 为团队节省时间

3.2 从”完成任务”到”创造价值”

完成任务（D级思维）：

• 目标：把功能做出来
• 标准：能跑就行
• 心态：”反正没人看”

创造价值（A级思维）：

• 目标：解决用户问题
• 标准：体验好、可维护、可扩展
• 心态：”这是我的作品”

真实案例：

//完成任务（D级）
function handleSubmit() {
  const name = document.getElementById('name').value;
  const email = document.getElementById('email').value;
  fetch('/api/subscribe', {
    method: 'POST',
    body: JSON.stringify({name, email})
  });
}

//创造价值（A级）
function handleSubmit() {
  const name = document.getElementById('name').value;
  const email = document.getElementById('email').value;

  // 1. 验证输入（用户体验）
  if (!name || !email) {
    showToast('请填写完整信息', 'error');
    return;
  }

  if (!isValidEmail(email)) {
    showToast('邮箱格式不正确', 'error');
    return;
  }

  // 2. 加载状态（用户体验）
  const button = document.getElementById('submit-button');
  button.disabled = true;
  button.textContent = '提交中...';

  // 3. 错误处理（健壮性）
  fetch('/api/subscribe', {
    method: 'POST',
    body: JSON.stringify({name, email})
  })
  .then(response => {
    if (!response.ok) {
      throw new Error('订阅失败');
    }
    return response.json();
  })
  .then(data => {
    showToast('订阅成功！', 'success');
  })
  .catch(error => {
    console.error('Subscribe error:', error);
    showToast('订阅失败，请稍后重试', 'error');
  })
  .finally(() => {
    button.disabled = false;
    button.textContent = '订阅';
  });
}

价值对比：

• D级：能用，但用户体验差，容易出错
• A级：体验好，健壮性强，用户满意

3.3 从”重复劳动”到”持续成长”

重复劳动（死循环）：

Week 1: CRUD → Bug修复 → CRUD → Bug修复
Week 2: CRUD → Bug修复 → CRUD → Bug修复
Week 3: CRUD → Bug修复 → CRUD → Bug修复
...
Week 10: 我还在做同样的事情，没有成长

持续成长（螺旋上升）：

Week 1: CRUD → 发现重复 → 思考优化
Week 2: 学习设计模式 → 应用到项目 → 分享给团队
Week 3: 创建通用框架 → 文档化 → 培训新人
Week 4: Code Review → 发现新问题 → 继续优化
...
Week 10: 我已经成为技术专家，指导他人

成长路径：
1. 发现重复（第1-2周）
– 意识到问题
– 开始思考解决方案

2. 学习改进（第3-6周）
– 学习设计模式
– 学习最佳实践
– 应用到项目

3. 分享传播（第7-10周）
– 总结经验
– 分享给团队
– 建立标准

4. 持续优化（第11周+）
– 发现新的问题
– 继续优化
– 成为专家

第四部分：实战案例 – 从CRUD到架构师

案例背景

时间：2021年3月 – 2023年6月
角色：前端工程师 → 技术负责人
项目：企业级SaaS平台（10个模块，10万行代码）

第1阶段：困境期（2021年3-6月）

状态：重复CRUD，感到厌倦

典型一天：

9:00-12:00: 写用户管理CRUD
13:00-17:00: 写产品管理CRUD（同样的代码）
17:00-19:00: 修复Bug（同样的错误）
19:00-21:00: 加班，还是CRUD

心态：

• “我是代码机器”
• “这工作没有意义”
• “我想辞职”

第2阶段：觉醒期（2021年7-9月）

转折点：某个周末，我看到一篇文章《The Law of Leaky Abstractions》

启发：

• “重复的代码不是问题，而是抽象的机会”
• “每次重复都是在提醒你：这里有优化的空间”

行动：
1. 停止盲目重复
– 不再直接复制粘贴代码
– 先思考：这个模式是什么？能否抽象？

2. 学习设计模式
– 工厂模式（解决对象创建问题）
– 策略模式（解决算法选择问题）
– 观察者模式（解耦模块依赖）

3. 应用到项目
– 创建通用API工厂（减少90%代码）
– 实现事件总线（解耦模块）
– 建立状态管理模式（统一数据流）

成果：

• 代码量：10万行 → 3万行（减少70%）
• 开发速度：3倍提升
• Bug数量：50%减少

第3阶段：成长期（2021年10月 – 2022年12月）

持续优化：
1. Month 1-3：建立自动化
– 自动化测试（单元测试覆盖率80%）
– 自动化部署（一键部署，30分钟 → 1分钟）
– 自动化文档（从代码生成API文档）

2. Month 4-6：知识沉淀
– 建立团队知识库（100+篇文档）
– 编写最佳实践指南
– 新人培训手册

3. Month 7-9：团队提升
– Code Review标准流程
– 技术分享会（每周一次）
– 代码质量监控（SonarQube）

4. Month 10-12：架构优化
– 微服务拆分（单体 → 微服务）
– 性能优化（首屏加载3秒 → 1秒）
– 监控告警（Prometheus + Grafana）

成果：

• 团队规模：3人 → 10人
• 项目规模：10个模块 → 20个模块
• 代码质量：A级（Lint通过率95%+）

第4阶段：成熟期（2023年1月 – 2023年6月）

成为技术负责人：
1. 技术决策
– 技术选型（React + TypeScript + Next.js）
– 架构设计（微前端 + Monorepo）
– 性能指标（首屏 90分）

2. 团队管理
– 招聘面试（技术能力 + 文化匹配）
– 绩效考核（OKR + 360度反馈）
– 职业规划（技术路线 vs 管理路线）

3. 业务价值
– 用户增长：1000 → 10000（10倍）
– 系统稳定性：99.5% → 99.9%
– 开发效率：3倍提升

回顾：

• 从CRUD代码机器到技术负责人
• 从被动执行到主动优化
• 从个人成长到团队成功

第五部分：立即行动的5个建议

建议1：本周做这3件事

1. 审查你的代码

找一个周末，做以下事情：
1. 列出你最近写的10个功能
2. 找出重复的模式（至少3个）
3. 抽象成通用函数或类

2. 建立Checklist

# 我的开发Checklist

编码前

[ ] 理解需求（不明确就问）
[ ] 设计数据结构
[ ] 考虑边界情况


编码中

[ ] 遵循命名规范
[ ] 添加必要注释
[ ] 错误处理


编码后

[ ] 自测（至少3个场景）
[ ] Code Review
[ ] 更新文档

3. 学习一个新工具

本周推荐：Prettier（代码格式化）

安装：npm install -g prettier
使用：prettier --write "**/*.js"
效果：统一代码风格，减少Review争议

建议2：本月达成这3个目标

1. 减少50%重复代码

• 目标：找出10个重复模式，抽象成5个通用函数
• 验证：代码行数减少50%
• 工具：SonarQube（代码重复检测）

2. 建立3个自动化脚本

• 部署脚本（一键部署）
• 测试脚本（自动化测试）
• 文档脚本（从代码生成文档）

3. 分享3次经验

• 团队内部分享（30分钟）
• 写技术博客（1篇）
• 开源贡献（1个PR）

建议3：养成5个习惯

习惯1：每日反思（5分钟）

每天下班前问自己：
1. 今天做了什么重复的事情？
2. 能否优化？如何优化？
3. 明天如何改进？

习惯2：每周总结（30分钟）

每周五下午：
1. 本周完成了什么？
2. 遇到了什么重复问题？
3. 学到了什么新东西？
4. 下周计划是什么？

习惯3：每月复盘（2小时）

每月最后一个周末：
1. 本月完成了什么目标？
2. 哪些方法有效？哪些无效？
3. 技能提升了多少？
4. 下月目标是什么？

习惯4：持续学习

每天30分钟：

看技术文章（1篇）
看开源项目（1个PR）
学新技术（1个小功能）

习惯5：记录分享

每周1篇：

记录遇到的问题
记录解决方案
分享给团队

结语：重复是卓越的阶梯

记住：
1. 重复不是问题，而是机会
– 重复意味着有模式
– 模式可以抽象
– 抽象带来成长

2. 从重复到卓越的3个步骤
– 发现重复（有意识）
– 抽象模式（想办法）
– 持续优化（成为习惯）

3. 心态决定高度
– 被动执行：永远在重复
– 主动优化：每重复一次都是成长
– 持续改进：从平凡到卓越

我的故事：

• 2021年：CRUD代码机器，想辞职
• 2022年：创建通用框架，成为技术专家
• 2023年：技术负责人，带领10人团队

你的故事：

• 从现在开始
• 发现重复
• 主动优化
• 持续成长
• 你也能从平凡到卓越

相关文章

• [VS Code进阶技巧:我用3年血泪史总结的15个实战技巧](https://www.chencunli.com/vs-code-advanced-tips/)
• [Linux性能分析工具:从凌晨3点的故障到系统化调优](https://www.chencunli.com/linux-performance-tools/)
• [浏览器调试艺术:从console.log到性能专家](https://www.chencunli.com/browser-devtools-tips/)

作者简介

作者: 陈存利，前端工程师 → 技术负责人

相关经历:

• 2021年：CRUD代码机器，差点辞职
• 2022年：创建通用框架，成为技术专家
• 2023年：技术负责人，带领10人团队
• 2024年：将3年经验整理成这篇文章

核心观点：

• 重复工作不是成长的敌人
• 每次重复都是优化的机会
• 从平凡到卓越，只需要3步：发现、抽象、持续

文章元信息:

• 字数: 约4,500字

• 更新日期: 2026-03-19
• 标签: #职业发展 #工作技巧 #重复工作 #成长 #程序员 #思维模式