A00 JavaScript 入门

本阶段目标：用原生 JavaScript 独立完成一张页面的交互——取数据、改结构、响应操作、在出错时给出提示。

所属：frontend/js / A-入门 ｜ 上一篇：无 ｜ 下一篇：A01-认识JavaScript与运行环境 ｜ 返回：科目 README

路线图

十篇按「在哪写 → 存什么 → 怎么算 → 怎么分支 → 怎么复用 → 怎么组织数据 → 怎么处理文本与数字 → 怎么碰页面 → 收口实战」推进。

flowchart TD
    S1["A01 认识 JavaScript 与运行环境"] --> S2["A02 变量与数据类型"]
    S2 --> S3["A03 运算符与类型转换"]
    S3 --> S4["A04 条件分支与循环"]
    S4 --> S5["A05 函数与参数"]
    S5 --> S6["A06 数组与对象"]
    S6 --> S7["A07 字符串与数字处理"]
    S7 --> S8["A08 DOM 操作与事件"]
    S8 --> S9["A09 实战待办清单"]

    subgraph P1["语言基础（A01 ~ A05）"]
        S1
        S2
        S3
        S4
        S5
    end

    subgraph P2["数据与页面（A06 ~ A08）"]
        S6
        S7
        S8
    end

    subgraph P3["收口（A09）"]
        S9
    end

图 1 阶段路线图：A01 ~ A05 建立语言基础，A06 ~ A08 解决数据组织与页面交互，A09 把前八篇合成一个可运行的应用

能力对照

能力	对应篇目	自检方式
把脚本正确接到页面上	A01	控制台能打印日志，模块脚本加载无报错
用合适的方式保存数据	A02	说明 let 与 const 的取舍，能列出五种原始类型
预测表达式的结果	A03	给定 "5" + 1 与 "5" - 1，能说出结果与原因
写出清晰的分支与循环	A04	三层嵌套的 if 能改写为提前返回，循环可读性不低于原版
把重复逻辑抽成函数	A05	同一段逻辑只出现一次，参数与返回值类型稳定
组织一组成对数据	A06	用数组存列表、用对象存单条记录，取值路径明确
处理用户输入的文本与数字	A07	输入 " 12px " 能安全转成 12
用事件驱动页面变化	A08	点击、输入、提交三类事件均能正确绑定与解绑
独立完成一个可用的交互应用	A09	待办清单支持增删改查与本地持久化，刷新后数据不丢

阅读顺序

顺序	篇目	建议时长	必读	说明
1	A01 认识 JavaScript 与运行环境	40 分钟	是	决定后续所有调试方式
2	A02 变量与数据类型	50 分钟	是	类型判断错误的源头
3	A03 运算符与类型转换	50 分钟	是	隐式转换是 bug 集中区
4	A04 条件分支与循环	50 分钟	是	控制流是所有逻辑的骨架
5	A05 函数与参数	60 分钟	是	复用与测试的最小单位
6	A06 数组与对象	60 分钟	是	数据处理的主力工具
7	A07 字符串与数字处理	50 分钟	是	表单与展示层必用
8	A08 DOM 操作与事件	70 分钟	是	页面交互的唯一入口
9	A09 实战待办清单	90 分钟	是	阶段收口，产出可运行应用

跳过建议

• 已有其它语言编程经验：A01 只做 3.2 节代码核对，A02 ~ A04 快速通读后直接进入 A05。
• 只做静态展示页：A06 之后可只读 A08 的事件绑定部分。

阶段出口

• 返回：科目 README
• 术语速查：Z01 术语表
• 下一篇：A01-认识JavaScript与运行环境