波仔
🧡 第十二章 实战项目1：Chrome扩展
📄 一句话概括

功能一个没少，代码只剩不到六分之一——靠四招：删死代码、合并重复、抽函数、删自造轮子；改完行为不变才叫重构。

📝 本节和前面几节的关系

前面五节把一个项目从头做出来；这一节回头看它——刚做出来的东西，几乎一定可以更短。

一、先看数字

1211 行 → 175 行，文件从 9 个到 4 个，最长函数从 180 行到 40 行。 砍掉 85.6%，而功能一个没少。 这个数字不是个例——AI 参与写的项目，第一版的冗余通常都很高。

二、四招

删掉没被调用的代码：试错时写下的、后来再也没用上的。 合并重复的块：同一段逻辑在三个文件里各抄了一遍。 抽成一个函数：五处各 30 行的重复，收成一处。 删掉自己造的轮子：标准库或浏览器已经有的，又写了一遍。

三、重构铁律

改完行为不变，才叫重构；顺手改了功能，那叫重写。 所以顺序永远是先让它跑通，再让它变短。 先跑通，你才有【行为不变】这个基准可以对照——这是顺序不能反的全部原因。

四、什么时候该重构

改一处要动五个文件 → 重复太多，该抽函数了。 同一个功能在两个地方各写了一遍 → 该合并了。 你已经不敢改它了 → 最危险的信号，先从删死代码开始。 做法也很简单：把这一段发给它，说【功能不变，让它变短】，然后重跑一遍验收。

五、动手 Demo：从 1211 行到 175 行

下面给重构前后的数字对照，以及四招各自的【省掉了什么】。

P("    重构前     1211 行     9 个文件")
P("    重构后      175 行     4 个文件")
P("    砍掉       85.6%      55.6%")
TH([u"动作", u"省掉的是什么"], [24, 54])

实跑输出：

--------------------------------------------------------------------
从 1211 行到 175 行
--------------------------------------------------------------------

第 12.8 节那个案例，数字摆出来就够说明问题了：

    重构前     1211 行     9 个文件     最长函数 180 行
    重构后      175 行     4 个文件     最长函数  40 行
    砍掉       85.6%      55.6%         77.8%

**功能一个没少，代码只剩不到六分之一**。靠的是四招：

  动作                   省掉的是什么
  --------------------------------------------------------------
  删掉没被调用的代码     试错时写下的、后来再也没用上的死代码
  合并重复的块           同一段逻辑，在三个文件里各抄了一遍
  抽成一个函数           五处各 30 行的重复，收成一处
  删掉自己造的轮子       标准库或浏览器已经有的东西，又写了一遍

重构有一条铁律：

    **改完行为不变，才叫重构；顺手改了功能，那叫重写。**

所以顺序永远是**先让它跑通，再让它变短**——
先跑通，你才有【行为不变】这个基准可对照。

功能一个没少，代码只剩不到六分之一——四招：删死代码、合并重复、抽函数、删自造轮子。 铁律：改完行为不变才叫重构；所以顺序永远是先跑通、再变短。

30 秒实验

  1. 挑一个你写过的文件，数一数最长函数有多少行——超过 50 行就该看看了。
  2. 把一段你都不敢改的代码发给它，只说一句【功能不变，让它变短】，然后重跑验收。

常见误区

  1. 一边重构一边加功能。那样你分不清行为变化是哪一步带来的。
  2. 先把代码改短再说。先跑通才有【行为不变】的基准——顺序反了，重构就成了重写。
自测三问（点开对答案） 1. 那个案例重构前后的行数是多少？ —— 1211 行 → 175 行，砍掉约 85.6%，功能不变。 2. 重构四招是什么？ —— 删死代码、合并重复、抽函数、删自造轮子。 3. 重构的铁律是什么？ —— 改完行为不变才叫重构；所以先跑通、再变短。

相关笔记