调试能力决定学习效率。与其反复改代码碰运气,不如在 Sources 里打断点,看当时变量到底是什么。
图:Console / Sources / Network 三件套
- Console:
console.log、console.table快速观察。 - Sources:行号旁打断点,单步 Step over / into。
- Network:确认请求是否发出、状态码与响应体。
- Elements:检查最终计算样式,定位 CSS 覆盖问题。
先复现,再定位,最后修。跳过复现步骤,容易修错地方。