2026-09-20 · 11 min read

2.1 认识你的电脑

从零建立对「电脑」这件事本身的直觉。

课时概要

你当然会用电脑,但「会用软件」和「会在电脑里工作」,不是一回事。很多人第一次学编程,卡住的并不是代码本身,而是:文件到底放在哪、文件夹和路径是什么关系、为什么别人说「路径」自己脑子里没有画面、代码文件该用什么打开、为什么电脑总报错说找不到文件。

这一节只做一件事:建立最基本的电脑工作直觉。这一步立住了,后面学终端、写网页、用 Git 都会顺很多。

以上为本节课官方讲义的开场,非观看笔记;只有跟完这一节才算自己的理解。

视频:【零到全栈】2.1-认识你的电脑 | 时长 19:12 | 模块 2 · 计算机与互联网

讲义:模块 2.1:认识你的电脑(李勃老师.com)

本节要点

  • 开发时卡住的往往不是代码,而是电脑本身的直觉:文件放哪、路径是什么、文件用什么打开。
  • 三块地基:文件 vs 文件夹、扩展名、路径(绝对 / 相对)。
  • 文件是内容,软件是打开内容的工具;代码文件用 VS Code 这类代码编辑器打开。
  • 真正重要的习惯是「打开整个项目文件夹」,而不是双击单个文件。
  • 三个好习惯:固定总文件夹、动手前先确认「我现在在哪个路径」、别堆「最终版」。

笔记正文(讲义整理)

文件和文件夹

  • 文件是具体内容:一张图片、一个视频、一篇文档、一段代码,都是文件。
  • 文件夹不是内容本身,而是装内容的容器。
  • 一个项目,本质上就是放在同一个文件夹里的一组文件:
我的第一个网站/
├── avatar.png
├── index.html
├── script.js
└── style.css

扩展名

文件名点后面的部分(.html / .css / .js / .png / .md)叫扩展名,入门阶段可以把它理解成「这大概是什么类型的文件」的提醒:

  • .mp3 音频,.png 图片;
  • .html 网页结构,.css 样式,.js 前端脚本。

Windows 和 macOS 默认可能把扩展名藏起来,建议在系统设置里让它一直显示扩展名,看文件时不容易糊涂。

路径:文件的地址

文件回答「这是什么」,路径回答「这东西放在哪里」。比如:

课程练习/模块3/第一个网页/index.html

就是一层一层地描述:课程练习 文件夹里有 模块3,里面有 第一个网页,最里面是 index.html。这整串位置描述,就是路径。

绝对路径 vs 相对路径

绝对路径 vs 相对路径信息图:文件是内容,路径是文件的地址;当前站在 course 文件夹里时,/Users/libo/Documents/course/index.html 是绝对路径,index.html 和 images/avatar.png 是相对路径

绝对路径:从一个固定起点,把完整位置说清楚。

  • macOS / Linux:/Users/libo/Documents/course/index.html
  • Windows:C:\Users\libo\Documents\course\index.html

根目录:绝对路径的起点。macOS / Linux 里是最外层的 /;Windows 里从盘符根开始,比如 C:\。

相对路径:不从整台电脑说起,而是从「你当前所在的位置」开始说。已经在 course 文件夹里,就可以直接写 index.html,或者 images/avatar.png;开头的 ./ 表示「当前路径」,也可以写成 ./index.html。

家目录:你这个用户自己的默认目录。macOS 上是 /Users/你的名字,Linux 上是 /home/你的名字,终端里常见的 ~ 就是它的简写。

为什么这一节要花这么多时间讲路径?因为后面到处都是它:用编辑器打开项目文件夹、在终端里进目录、网页里引图片、Git 管理文件——都是在处理路径。它不是附属知识,而是后续很多操作的共同底层。

文件和软件,不是一回事

  • 文件是被保存的内容(.docx、.mp3、.png);
  • 软件是打开、查看、编辑、处理这些内容的工具(Word、播放器、图片编辑器)。

一句话:软件负责操作,文件负责承载内容,路径负责指路。

VS Code:代码文件的工作台

.html / .css / .js 这些代码文件,用代码编辑器打开。这门课用 VS Code(免费,官网 code.visualstudio.com 下载)。

入门阶段对它的要求很低:打开一个文件夹、在文件树里看结构、新建 / 打开 / 修改 / 保存文件、知道自己当前在编辑哪个文件——够了。

最容易迷路的三个地方

  1. 以为在改 A 文件,其实改的是 B 文件:course、course-new、course-final、course-final-2 长得很像,结果改了副本。
  2. 只看文件名,不看文件夹:index.html 到处都有,真正重要的是「这个文件属于哪个项目文件夹」。
  3. 只会双击打开文件,不会打开整个项目文件夹:代码之间是互相引用的,打开整个文件夹才能看到项目结构。

最该建立的三个工作习惯

  1. 给课程练习准备一个固定总文件夹(如 zero-to-tech、fullstack-learning),名字不重要,固定最重要。
  2. 每次先确认「我现在在哪个文件夹 / 哪个路径下」——不管用编辑器还是终端,先问自己一句。
  3. 少造「最终版」「最终版2」「最终版3」:短期像在保底,长期把自己绕晕。更稳的方式是清晰的文件夹 + 固定文件名 + Git 管版本(这也是模块 3 要引入 Git 的原因)。

和之前 GFG 笔记的连接

讲义讲的是直觉,之前整理的 GFG Python 笔记正好是这套直觉的「代码版」,两边可以对上:

讲义里的说法Python 里的对应(GFG 笔记)
「当前所在的位置」CWD(当前工作目录):os.getcwd() / Path.cwd()——脚本从哪个文件夹跑起来的
相对路径从当前位置说起Python 里相对路径就是相对 CWD 解析;os.chdir(path) 就是代码版「切换文件夹」
看文件夹里有什么os.listdir(path) / Path.iterdir()
拼接路径、跨平台pathlib 用 / 运算符拼路径,自动处理 macOS 正斜杠 / Windows 反斜杠
根目录 /、家目录 ~在 pathlib / os 里就是普通路径对象,后面终端和后端还会反复见

详细代码例子见之前整理的 GFG 笔记:Python Directory Management(os / shutil 全套目录操作)和 Pathlib Module(面向对象的路径处理)。

关键概念

  • 文件 / 文件夹:文件是内容,文件夹是装内容的容器;一个项目 = 同一个文件夹里的一组文件。
  • 扩展名:文件名点后面的部分,提示文件类型(.html / .css / .js / .png…)。
  • 路径:文件的地址,一层一层描述文件在磁盘上的位置。
  • 绝对路径:从根目录说起的完整位置(/Users/libo/...、C:\...)。
  • 相对路径:从当前位置说起的位置,./ 表示当前路径。
  • 根目录 /:整个路径系统的最外层起点(Windows 对应盘符根 C:\)。
  • 家目录 ~:当前用户的默认目录(/Users/名字、/home/名字)。
  • CWD:代码运行时的「当前所在文件夹」,相对路径都相对它解析(os.getcwd())。
  • 代码编辑器:打开 / 编辑代码文件的软件,这门课用 VS Code。

代码 / 实操

  • 安装 VS Code(免费)。
  • 在系统设置里开启「显示文件扩展名」。
  • 用 VS Code 打开整个项目文件夹(而不是双击单个文件),在左侧文件树里认一认结构。
  • 给自己建一个固定的课程练习总文件夹,后面所有练习都放它下面。

我的收获

  1. 开发时迷路多半不是代码问题,而是「不知道自己在哪个文件夹」——动手前先问「我在哪」,比急着写代码重要得多。
  2. 路径不是一串无意义的字符,而是文件的地址;绝对路径从根说起,相对路径从「当前位置」说起。
  3. 打开整个项目文件夹,而不是双击单个文件——代码之间互相引用,项目是「一组文件的关系」。

待深入

(待填:没听懂、想回头查的。)