Nicholas C. Zakas 分享如何熟悉并修改陌生代码

Nicholas C. Zakas（“JS 红宝书”的作者）在最新一期的简报^[1] 中，讲述了自己重写 ESLint 代码路径分析（Code path analysis）的经验。

虽然 ESLint 是 Zakas 创建的，但关于代码路径分析这块不是他写的，而是由一个贡献者在很多年前设计和实现的，那个人早就离队了。要命的是，这部分代码是在启用 ESLint RFC 前很久写的，所以没有任何描述它实际工作方式的设计文档，注释也很少。

Zakas 认为这块是“魔术”，曾经试图避免碰它。但没办法，现在因为需要，要必须对它的核心进行重写。重写的过程非常痛苦，有时会被气到想要砸桌子。

最终经过两个星期多，Zakas 按照下面的步骤开始慢慢熟悉并修改代码。趁着有时间，写出来和大家分享。

从小事做起（Start small）

我做的第一件事就是试图找到我能理解的最小的原子代码（smallest atomic piece of code）。这段代码是一个名为“remove”的函数，我发现它只是在数组中搜索给定的值，然后将其从数组中删除。所以我将函数重命名为“removeFromArray”并从那里开始。接下来，我找到了一个表示代码路径的一个小类（代码量比较少）。我仔细检查了一遍，确保我理解了每个属性代表什么，每个方法做什么。从那里，我转到了其他类。

打破功能（Break things）

一旦我认为我理解了一些方法是如何工作的，我就故意打破它们。我在这里注释掉了一行，或者在那里更改了一行，然后重新运行测试，看看这些更改如何破坏代码。在某些情况下，我认为代码的工作方式是正确的，在许多情况下我完全错了。不过因为我有测试可以依赖，我能够看到小的更改如何影响更大的代码库，同时确保我可以回退到最后一次能正常运行的状态。

留下注释（Leave breadcrumbs）

在对代码库更加熟悉之后，我开始在所有我能看到的地方留下注释。我更新了 JSDoc 注释，以帮助 VS Code 理解我们正在处理的类型，我在代码的复杂部分留下了大块注释，解释了我通过打破功能所学到的东西。我将对象字面量重构成类，以更好地表示数据。这最终产生了几个 Pull Request^[2]，将这些注释添加回代码中，确保这些新知识不会在未来丢失。