CODING 学习 · 交互演示（第 4 讲配套）

亲手跑一次 TDD 红绿灯

这个页面里是一个真的能跑的最小系统：左边是测试代码，右边是正式代码，下面的按钮真的会执行它们。

跟着做：① 先读左边的测试代码（注意：它在实现之前就写好了）→ ② 右边保持「🈳 空壳版」，点下面的「▶ 跑测试」——亲眼看红 → ③ 切到「❌ 写错版」再跑一次——看红灯怎么抓住写错的 AI → ④ 切到「✅ 正确版」再跑——绿，考试通过。

📋 测试代码（先写的）= 你的两条 Gherkin 场景

// 场景①（Given 60 元、系数 0.85 → Then 85 元）
测试("正常路径：60 × 0.85 → 85 元", () => {
  // 准备（Given）：消费 60，系数 0.85
  // 执行（When）：跑结算
  const 结果 = 结算金额(60, 0.85);
  // 断言（Then）：必须严格 = 85，否则红灯
  断言等于(结果, 85);
});

// 场景②（Given 系数缺失 → Then 阻断，不出账）
测试("异常边界：系数缺失 → 阻断", () => {
  断言会报错(() => 结算金额(60, 缺失));
});

⚙️ 正式代码（后写的）——选一个版本

当前使用：🈳 空壳版 —— 猜猜会几红几绿？

$ node 结算.test.js
（点上面的「▶ 跑测试」）

三种状态对照：这就是「红绿灯」的全部含义

正式代码的状态	灯	说明
🈳 空壳（还没实现）	🔴🔴	该红。功能不存在，测试就该失败。这一步叫「跑红」——先证明这盏灯真的会亮。
❌ 写错（忘了 ÷0.6）	🔴🔴	灯抓住了 AI。AI 会自信地说「完成了」，但断言算出 51 ≠ 85，红灯不跟它客气。这就是「不可糊弄」。
✅ 正确	🟢🟢	可信的绿。因为你亲眼见过它红，这个绿才有分量。

烟雾报警器装好后，你总得点根烟试试它响不响——万一电池没装，「一直安静」就不是「没火」，而是「聋了」。跑红 = 给测试本身做的体检。

「跑红」= 实现还不存在时先跑测试，亲眼看它失败。
先红 → 证明灯会亮；后绿 → 证明活干完了。AI 说了不算，灯说了算。

最后留意终端里的「退出码」：红 = 1，绿 = 0。人看颜色，机器看这个数字——第 5 讲的门禁判 PASS/FAIL，读的就是这类信号。