附录

附录一：常见计算机术语速查表

这一部分不需要刻意背诵，更重要的是先在脑子里建立一个印象。

一、和“工具界面”有关的词

1. IDE、编辑器、终端

IDE（集成开发环境）
可以把 IDE 想象成“程序员的工作台”：

• 一边是写字的桌面（编辑器），
• 一边有电源插座和按钮（运行、调试），
• 抽屉里有各种小工具（搜索、版本管理）。
  VS Code、Trae、Cursor 都属于 IDE 或基于 IDE 改的工具。

代码编辑器（Editor）
更像是“高级记事本”，只负责：

• 让你打字写代码；
• 用颜色区分不同内容（语法高亮）；
• 给你自动补全。
  IDE 里那块写代码的区域，就是代码编辑器。

终端 / 命令行（Terminal / 命令行窗口）
一个黑底白字的窗口，你在里面输入命令让电脑干活：

• 比如：npm run dev 表示“帮我启动开发服务器”；
• python main.py 表示“运行这个 Python 文件”。
  可以把它想象成：“你给电脑发一条条短信命令，它用文字回复执行结果”。

2. IDE 中几个常见区域

活动栏（Activity Bar）
最左边一排竖着的小图标，像“功能选项卡”：

• 点文件图标 → 左边显示文件列表；
• 点放大镜图标 → 左边变成搜索；
• 点 Git 图标 → 左边显示版本管理。

侧边栏（Side Bar）
活动栏右边那一大块区域，专门显示当前模式下的内容：

• 文件模式：展示项目里的文件和文件夹；
• 搜索模式：展示搜索结果列表；
• 源代码管理模式：展示有哪些文件被改动。

编辑区（Editor）
中间最大的区域，就是你打开文件后实际看到和修改内容的地方；
上方的标签页（Tab）是“当前打开了哪些文件”。

底部面板（Panel）
一般在最下方，常见几种：

• Terminal（终端）：输入命令跑项目；
• Problems（问题）：列出出错的文件和行号；
• Output（输出）：一些工具打印出来的运行信息；
• Debug Console（调试控制台）：调试时的输出。

状态栏（Status Bar）
最下面那条细细的栏：

• 显示当前文件是什么语言（JS、HTML、Python 等）；
• 显示缩进是“2 个空格”还是“4 个空格”；
• 显示有没有错误、当前 Git 分支是什么。
  可以把它当作“当前编辑环境的一张小体检单”。

二、和“网页 / 网络 / 服务”有关的词

1. URL、http、端口、本地服务

URL（网址）
就是浏览器地址栏那一串东西，比如：

• https://www.trae.cn/
• http://localhost:3000/
  它就像“互联网世界里某个房间的完整地址”。

HTTP / HTTPS
在 URL 开头看到的 http:// 或 https://：

• HTTP：普通传输方式；
• HTTPS：多了一层加密，更安全。
  你可以先记成：“写网页地址时，通常以 http 或 https 开头”。

端口（Port）
可以把一台电脑想象成一栋大楼，端口就是每个房间的门牌号：

• :3000 表示 3000 号房间；
• 同一台电脑上，可以同时开多个服务，各占一个端口。
  http://localhost:3000 就是“访问我自己电脑上 3000 号房间里跑着的那个服务”。

本地（Local / localhost）
指的就是你自己的电脑。

• localhost 可以理解为“这台机器自己”。
  当你访问 http://localhost:3000，其实是在跟自己电脑上运行的程序打交道，而不是上网访问别人家的服务器。

服务（Service / Server）
“服务”就是一个一直在后台运行、随时听你指令的程序：

• 网页服务：浏览器访问一个地址时，它返回网页内容；
• 游戏服务：负责管理对局、存档、排行榜等。
  在终端里执行 npm run dev 启动项目，本质上就是“在本地开了一个网页服务”。

三、和“前端 / 后端 / 数据”有关的词

1. 前端、后端

前端（Frontend）
用户看得见、点得到的部分：

• 网页上的按钮、文字、图片、动画；
• React / Vue 写出来的页面。
  负责展示界面和响应用户操作（点击、输入、拖拽等）。

后端（Backend）
用户看不见、在服务器上跑的那部分：

• 存和读数据（用户信息、订单、分数等）；
• 执行业务规则（登录验证、权限判断）。
  你可以把前端比作“店面和店员”，后端比作“仓库和账本系统”。

2. 接口、请求、响应、JSON

接口 / API
前端和后端事先约定好的一套“问问题 + 回答案”的规则。

• 前端说：“我用这个地址、这个格式来问你”；
• 后端说：“我用这个格式把结果回给你”。

请求（Request）
前端发给后端的一次“提问”：

• 请求去哪（URL）；
• 用什么方式（GET、POST 等）；
• 带了什么参数（比如用户 ID）。

响应（Response）
后端给前端的“答复”：

• 状态码（200 成功，404 找不到，500 服务器出错）；
• 实际数据（多半是 JSON）。

JSON
一种用很像 JavaScript 代码的写法来表示数据的格式，比如：

{
  "name": "Alice",
  "score": 120
}

可以理解成“机器版的键值对记事本”，前后端经常用它来交换数据。

四、和“写代码本身”有关的词

1. 变量、标识符、状态

变量（Variable）
“给一块数据贴上的标签”。

• 例如把分数这件事记作 score；
• 以后用 score 这个名字，就能读写这块数据：

let score = 0
score = score + 10

标识符（Identifier）
“你自己起的各种名字”的统称：

• 变量名：score
• 函数名：moveSnake
• 组件名：SnakeGame
  就像给文件夹起名“照片”“工作”“账单”，方便在代码里区分不同“东西”。

状态（State）
程序当前的“关键情况记录”：

• 游戏是不是已经结束；
• 蛇现在在第几格；
• 当前分数是多少。
  在 React 里，一般会这么理解：状态一改，界面就要跟着更新。

2. 函数、组件、模块

函数（Function）
把一件“可以反复做的事”打包起来，起个名字：

function sayHello(name) {
  console.log('Hello, ' + name)
}

以后只要写 sayHello('Bob')，就等于把里面那几行再次执行一遍。

组件（Component）
前端里的“可以重复用的一块小界面 + 小逻辑”：

• 一个按钮可以是组件；
• 一个顶部导航可以是组件；
• 整个游戏区域也可以是一个组件。
  组件之间可以拼装，就像搭乐高。

模块（Module）
“一组相关代码组成的文件”：

• snakeLogic.ts 专门放和“蛇怎么动”相关的代码；
• score.ts 专门放算分数的代码。
  模块之间可以互相“导入 / 导出”，像不同抽屉里的工具。

3. 语法、编程语言、框架

语法（Syntax）
某门编程语言的“语法规则”和“标点习惯”：

• 字符串要加引号；
• 每条语句末尾要不要写分号；
• 代码块要用 {} 包起来。
  写错语法，编译器 / 解释器会直接报“语法错误”。

编程语言（Programming Language）
和计算机沟通的一整套规则和词汇，比如：

• JavaScript、Python、Java、C++、Go……
  不同语言适合做的事情、写法和工具生态不同。

框架（Framework）
别人帮你“先搭好骨架”的一大套代码和套路：

• 前端：React、Vue（帮你处理界面更新、状态管理等）；
• 后端：Django、Spring Boot 等。
  你等于是在“现成的骨架上填内容”，比从头造轮子轻松很多。

五、和“调试 / 查错”有关的词

1. Bug、报错、日志 / console.log

Bug
程序表现和你想的不一样，就是 bug：

• 本来应该出现按钮，结果没有；
• 本来应该加 10 分，结果多加了一堆；
• 页面一打开就白屏。

报错信息（Error Message）
程序崩了之后，屏幕上 / 终端里那段“看起来很吓人”的英文。
虽然难看，但通常会告诉你：

• 大致是哪里错了；
• 哪个文件、第几行附近需要检查。
  你可以直接复制它，丢给 AI 让它翻译和分析。

日志（Log）
程序在运行过程中自己“说的话”。
最常见的就是前端里的：

console.log('当前分数', score)

你可以把它理解成：在关键步骤主动报个数，方便你确认程序是不是按你想的在走。

console.log 是什么？

• console 可以理解为“调试用的小黑板”；
• .log 是“在小黑板上写一行字”；
• 浏览器按 F12 打开开发者工具里的 Console 面板，就能看到这些输出。

2. 调试、断点、单步执行、快照

调试（Debug / 调试程序）
当程序出问题时，不是上来就乱改，而是：

• 让程序在某一行停一下（断点）；
• 看一看当前每个变量的值；
• 一步一步往下走，观察“从哪里开始不对劲”。

断点（Breakpoint）
可以把断点想成“在这行插了一个暂停按钮”：

• 程序平时是一路往下跑；
• 跑到你插断点的那一行，会暂时停住，等你检查。

单步执行（Step）
从断点停下来之后，你可以选择：

• 一行一行往下执行（step over）；
• 进入某个函数内部详细看（step into）。
  就像看一段舞蹈分解动作一样，而不是直接看快放视频。

快照（Snapshot）——简化理解
这里的“快照”可以理解为：

在某个时间点，把“当前状态”拍一张照片，方便以后对比。
在实际工具里，“快照”可能指：

• 一次提交时刻项目的完整状态；
• 调试时某个时间点内存 / 变量的整体情况。
  你先记住这个比喻就够用：快照 ≈ 某一刻状态的留影。

六、和“项目管理”有关的词

1. 项目、工作区、文件夹

项目（Project）
为实现一个应用而放在同一个文件夹里的：

• 源代码文件
• 配置文件
• 素材（图片、音频等）

工作区（Workspace）
VS Code / Trae 用来描述“当前这一次打开了一组什么东西”的概念：

• 打开一个文件夹 → 一个简单工作区；
• 有时也会把多个文件夹合并成一个多项目工作区。

2. Git、仓库、提交（Commit）

Git（版本控制工具）
可以理解成项目的“时光机”：

• 每次改完一批内容，可以“拍一张版本合照”；
• 以后需要时，可以回到某个历史状态。

仓库（Repository / Repo）
开启 Git 之后，那个带“版本记录”的项目文件夹，就叫“仓库”。

提交（Commit）
每次你觉得“这波改动算一个阶段性成果”，就可以：

• 写一条说明（比如：Add score panel）；
• 把当前全部修改打包成一个版本；
• Git 会把这一刻的状态存下来。
  这一次动作就叫“做了一次 commit”。

七、和“AI 开发工具”有关的词

1. AI IDE、Agent、SOLO 模式

AI IDE
在普通 IDE 的基础上，多了一层“能听懂人话、能自己动手”的 AI：

• 你说“做个贪吃蛇”，它能帮你搭项目、写代码；
• 你把报错截图给它，它能先解释再尝试修复；
• 它能跨多个文件一起改，而不仅仅是一行一行补全。

Agent（智能体）
可以把 Agent 想象成一个长期待命的 AI 小工程师：

• 会读你的项目结构；
• 会拆解任务（先装依赖、再生成代码、再跑项目）；
• 跑出错之后，会根据错误信息自己调整方案。

SOLO 模式（以 Trae 为例）
表示：

你只需要把“终点”说清楚，
它自己规划“路线”，
在本地一步步执行，
中途才在关键节点问你要不要继续。

2. 模型、密钥（API Key）

模型（Model，这里特指大语言模型）
这个词可以简单理解为“背后那一大坨 AI 大脑”：

• 比如 GPT、Claude、Kimi、GLM 等；
• 不同模型在“理解中文”“写代码”“推理”上水平不一样；
• AI IDE 里通常可以在下拉菜单里换不同模型使用。

密钥 / API Key
你可以把 API Key 理解为一个很长的“高级密码 + 身份证号”，
它的作用只有一个：

告诉别人的服务器：“我是哪个用户，请允许我使用你们的 AI 服务，并帮我记账。”

几个要点：

• 这串东西通常是一长串随机字母数字；
• 不能发到公开的地方（仓库、截图、群聊），别人拿到就可以冒用你的账号；
• 在工具里填 API Key，就等于“把钥匙插进锁里”，之后工具就能帮你调用对应的 AI 服务。

八、和“浏览器 / 开发者工具”有关的词

Chrome（谷歌浏览器）
现在前端开发最常用的浏览器之一：

• 打开网页快；
• 自带比较强的“开发者工具”，方便查问题。

刷新（Refresh / Reload）
重新加载当前网页：

• 修改前端代码后，如果没有自动刷新工具，手动按刷新才能看到效果。

开发者工具（DevTools）
浏览器里专门给开发者用的一组工具面板：

• 查看网页结构（Elements）；
• 查看样式（Styles）；
• 查错误和日志（Console）；
• 查网络请求（Network）。
  在 Chrome 里通常按 F12 或 Ctrl+Shift+I 打开。

Console（控制台）
开发者工具里的一个标签页，专门展示：

• 你写的 console.log(...) 输出；
• 运行过程中发生的错误（红字）。
  你可以当它是“程序的聊天框”：
• 程序有话要说，就写在这里；
• 你调试时最常看的就是这一块。

如果后面你在学习过程中又遇到新的词，也可以按这个风格让 AI 协助你补充全部内容：

• 先写一句“它是干嘛的”；
• 再写一句“可以把它想象成什么”；
• 最后给一个特别简单的小例子。
  这样你的“个人术语表”会越长越实用，逐渐能够更好的与计算机进行沟通。