📚 普通人AI编程学习课程

30节系统课程，从零开始掌握AI编程助手

第 5 课 / 共 30 课

第5课: 调试与错误处理

📖 约2500字 | ⏱️ 预计20分钟 | 🎯 入门级

🎯 课程目标

完成本课程后，你将能够：

  • 理解常见的编程错误类型
  • 学会阅读和理解错误信息
  • 掌握使用 AI 进行调试的方法
  • 建立良好的错误处理习惯

🔍 常见错误类型

错误类型 说明 示例
语法错误 代码拼写或格式问题 缺少分号、括号不匹配
类型错误 数据类型使用不当 数字与字符串相加
引用错误 使用了未定义的变量或函数 变量名拼写错误
逻辑错误 代码运行但不产生正确结果 条件判断写反
网络错误 API 请求失败 跨域问题、网络超时

📖 读取错误信息

浏览器控制台错误

Uncaught ReferenceError: todoList is not defined
at HTMLButtonElement.<anonymous> (script.js:42)
at HTMLButtonElement.addEventListener (script.js:15)

# 错误分析：
# 1. 错误类型：ReferenceError（引用错误）
# 2. 错误位置：script.js 第 42 行
# 3. 问题原因：变量 todoList 未定义

🤖 使用 AI 调试

💡 AI 调试 Prompt 模板

"我的代码出现了错误，请帮我修复。

## 错误信息
【粘贴错误信息】

## 相关代码
【粘贴相关代码片段】

## 预期行为
【描述你期望的结果】

## 实际行为
【描述实际发生的情况】"

🔧 常见错误修复示例

示例1：变量未定义

# 错误代码
console.log(todoList) // todoList 未定义

# AI 修复建议
"需要在使用变量前定义它，或者确保元素存在"

# 修复后代码
const todoList = document.getElementById('todoList');

示例2：函数未定义

# 错误代码
addTodo() // 函数未定义

# AI 修复建议
"需要先定义 addTodo 函数"

# 修复后代码
function addTodo() {
// 函数逻辑
}

✅ 调试最佳实践

  • 先读错误信息：错误信息通常包含行号和错误类型
  • 复制错误信息给 AI：让 AI 帮助分析和修复
  • 一次修复一个问题：避免同时修改多处
  • 修改后测试：每次修改后都要验证是否解决
  • 保留备份：修改前保存原始代码

🎯 课后练习

请完成以下练习：

  1. 故意制造一个语法错误，观察浏览器报错
  2. 使用 AI 调试工具修复错误
  3. 练习阅读错误信息和定位问题
  4. 建立一个常见错误解决方案笔记
← 上一课: Prompt 编写进阶 下一课: HTML与CSS基础 →