从语法到异步，按阶段完成 11 个练习。每个练习都可立即运行并获得验证反馈。
从变量到异步编程，系统学习 JS 核心概念
建议按顺序完成练习，每题先独立尝试，再用提示和解法复盘。这样更容易形成可迁移能力。
先打牢语法，再强化数据处理，最后完成 DOM + 异步。每阶段结束都做一次自检，确保能迁移到真实项目。
面向零基础：先理解“变量是什么”，再学会声明字符串、数字、布尔值并打印结果。
面向初学者理解 let/const：变量为什么会“作用域错乱”，以及如何避免。
从“加减乘除”到“条件判断”，用学生熟悉的例子理解运算符。
面向新手：先学会“程序如何做决定”，再练 if/else 与三元表达式。
从“重复做一件事”出发，理解 for/forEach/map 在新手任务中的区别。
新手必修：把“重复逻辑”封装成函数，理解参数输入与返回输出。
给已会基础函数的新手做升级：把 function 写法迁移到箭头函数。
面向新手理解“不给参数也能跑”的写法，提升函数稳定性。
从“字符串拼接很乱”出发，教新手用模板字符串写出更清晰文案。
把“从对象/数组里取值”这件事简化成一行，适合新手进阶 ES6。
用“合并数组”和“不定参数求和”两个新手常见任务理解 ... 的两种角色。
把 ES6 对象语法写清楚：减少重复代码、支持动态 key，让对象构建更直观、更少拼写错误。
先把 class 当作“对象工厂”，再理解 constructor 和方法的分工。
把 generator 从抽象语法变成可操作工具：按需产出序列、筛选序列、生成步长序列。
通过搜索框和滚动加载两个真实场景，理解“什么时候用防抖、什么时候用节流”，避免只背概念。
用学生能理解的方式学习封装：为什么要隐藏内部变量、如何只暴露必要 API、怎样避免全局污染。
把“模块之间怎么通信”讲清楚：A 只发事件、B 负责监听，降低耦合并提升可维护性。
把流程控制写成可读规则：状态 + 事件 -> 下一状态，避免流程乱跳，提升可维护性。
从学生视角理解记忆化：当输入重复时不必重复计算，学会用 Map 做缓存并计算命中率。
以学生视角掌握不可变更新：数组追加、对象改字段、列表项切换，避免副作用导致状态错乱。
面向初学者：先学会“是否包含”的判断，再学会用 ** 做平方/立方，建立 ES7 的第一套实战语法感。
面向零基础：一步步学会数组 includes 与字符串 includes，理解“命中判断”在搜索、筛选里的真实用途。
面向初学者：从平方/立方开始，逐步理解 ** 和 **=，学会把公式需求转成可运行代码。
从学生视角理解“对象转数组再转回对象”的核心流程，掌握 ES8 对象工具在统计与筛选中的用法。
从“看起来乱”到“整齐可读”：学习 padStart/padEnd，让编号和名称在控制台或表格文本中对齐。
以学生视角学习 async/await：先拿到单个异步结果，再做并发加载，最后学会失败兜底，理解前端真实请求流程。
面向初学者：学习字符串大小写处理、模板字符串拼接和包含判断，建立文本处理的基础能力。
面向新手：理解数组为什么是前端高频数据结构，并通过创建、筛选、查找三个步骤建立数组思维。
从学生视角理解对象：先存用户信息，再解构读取，再合并对象，建立“现实实体 -> 代码对象”的映射思维。
从学生视角掌握数组高阶方法：先筛选再提取、再做汇总、最后做条件判断，形成前端数据处理通用套路。
从学生视角掌握 ES6 集合：先用 Set 去重，再用 Map 建字典查询，理解它们和数组/对象的区别。
从业务角度学习常见算法工具：去重排序、词频统计、榜单求和，建立可复用函数思维。
面向初学者：学习如何选中页面元素并修改文字、样式、class，理解 JavaScript 如何真实影响页面显示。
从零理解事件驱动：点击、输入、提交分别怎么监听，如何把用户动作变成页面变化。
面向新手：先理解“为什么要异步”，再一步步写 delay、await 和 try/catch，掌握前端请求最常见的代码骨架。
以学生视角学习 Promise.all：从两个异步值并发获取开始，逐步完成拼接和汇总，理解为什么并发通常比串行更高效。
用学生能跟上的方式理解异步循环：先写单个 async 转换，再用 Promise.all 批量处理，最后做结果汇总。
面向初学者：解决“字段缺失就报错”的常见问题，学会 ?. 安全访问与 ?? 默认值兜底。
从学生角度理解 try/catch 和边界校验：输入不可信时如何给出安全返回，保证页面稳定运行。