慕课网-大前端

前端这门手艺有个特点：写起来容易，写对了难。能拼出一个页面，和能交付一个别人愿意接手、上线不出事的前端项目，中间隔着一堆没写在教程目录里的东西。这套大前端课程适合拿来对照检查——你现在缺的是哪一段，就直接跳到哪一段去补，不必从头再听一遍 HTML 标签。

先确认几件事，能省掉大量无效时间

如果你已经能写页面但心里没底，先自测三个问题：闭包和作用域链能讲清楚吗？this 的指向在箭头函数和普通函数里为什么不同？事件循环里微任务和宏任务的执行顺序能推演吗？答不上来，JS 部分就不要跳。

如果 JS 没问题但一进项目就发怵，问题多半不在语言，而在工程链路：模块怎么拆、构建工具做了什么、依赖为什么锁版本、环境变量怎么区分。这部分课程里对应的是打包与工程化环节，看的时候别只记配置项，重点搞明白每一步在解决什么问题——配置会过时，问题不会。

框架部分同理。Vue 和 React 放在一起讲是有意为之：它们解决的问题高度重合，差别在实现思路。看的时候拿同一个需求分别做一遍，比分别听两遍讲解有用得多。组件通信、状态管理、生命周期（或副作用）的触发时机，这三处是面试和实际改 bug 时的高频区。

配套练习怎么做才不算白练

• 每学完一个语言特性，用十行以内的代码把它复现一遍，不查资料。写不出来就说明只是看懂了，不是会了。
• 框架阶段挑一个自己常用的网站，把它的列表页和详情页手写一遍，数据先用本地 JSON 顶替，跑通渲染和路由再谈请求。
• 工程化部分动手改一次构建配置，比如加个分包、改个代理、调一下资源内联阈值，然后观察产物文件的变化。看懂了产物，才算真懂了构建。
• 性能优化不要背指标名词，拿 Chrome 的 Performance 面板录一次自己写的页面，找到最长的那个任务，说清楚它为什么长。这比记住十几个优化手段管用。

哪些内容值得反复看

一是浏览器渲染相关的部分：从 HTML 解析到布局、绘制、合成，这条链路决定了你后面所有性能判断的方向。二是异步与请求处理：接口失败、超时、竞态、重复提交，这些不是边缘情况，是日常。三是模块化与类型系统：TypeScript 在这里的价值不是语法糖，而是让接口边界显式化，团队协作时少吵架。

相对可以快进的是各类语法速查式的罗列。这些内容查文档比看视频快，把时间留给需要动手才能理解的环节。

看完之后你应该能回答的问题

• 一个页面从输入地址到你能交互，中间经历了哪些阶段，哪一步最容易成为瓶颈？
• 两个组件需要共享状态，什么情况下用 props 传、什么情况下该抽出去单独管理？
• 打包后的产物里为什么会多出你没直接引用的代码，怎么判断它该不该在？
• 线上出现白屏，你的排查顺序是什么？

能顺畅答出这几题，说明这门课的内容确实落到你身上了。答不上也没关系，回到对应章节再动手一遍，比继续往后赶进度划算。