# 两周刷完 100 道前端面试真题

对于准备跳槽或需要应对技术考核的前端工程师来说，面试往往不是考察“你能不能写出代码”，而是考察“你能不能在有限时间内清晰表达思路并处理常见陷阱”。这套资料的核心价值在于“实战化”和“高频性”。它避开了那些冷门、过时的知识点，聚焦于近年来大厂及中型互联网公司面试中出现频率最高的 100 道题目。这不仅仅是刷题，更是一次对前端知识体系的快速体检。通过高强度的真题演练，你能快速发现自己知识盲区——是 JS 事件循环理解不深，还是 React 性能优化方案停留在理论层面。这种针对性的查漏补缺，比泛泛而读教程效率高得多。

适合人群与基础要求

这套资料并非零基础教程，不适合刚入行、连 DOM 操作和 CSS 盒模型都还没吃透的新手。它的目标读者是拥有至少一年前端开发经验，或者在校学习但已能独立开发简单页面、准备进入求职市场的同学。你不需要是资深架构师，但必须具备扎实的工程基础，能够读懂中级难度的业务代码。如果你连基本的 ES6 特性（如 Promise、解构、模块化）都用不熟练，建议先暂停刷题，回头补基础，否则面对这些真题时会因为语法细节卡壳，无法进入逻辑推演的深层讨论。

建议学习路径与练习方法

不要试图在两周内“背”下所有答案。建议将 100 道题分为三个板块：JS 核心机制、框架原理（React/Vue）、以及工程化与性能优化。前五天集中攻克 JS 核心，重点在于手写代码（如手写 Promise、防抖节流、深拷贝）和原理阐述；中间五天转向框架，侧重考察生命周期、虚拟 DOM 差异、状态管理策略；最后几天处理工程化问题，如 Webpack 配置优化、浏览器渲染流程、跨域解决方案。

资料包通常包含题目解析或代码示例。正确的用法是：先限时 15 分钟独立作答，写出你的思路或代码；再看参考答案，对比差异；最后将题目中的核心考点整理成自己的笔记，并尝试复述给别人听。如果某类题目错误率高于 30%，说明该领域是你的短板，需额外投入时间。重点不是做对题，而是建立“问题-原理-解决方案”的思考模型。

学完能独立做什么

完成这套训练后，你应具备独立应对技术面试的能力。具体表现为：面对八股文问题，能跳出死记硬背，从底层原理角度解释；遇到场景题（如“页面白屏如何排查”），能给出结构化的排查步骤而非盲目猜测；在算法基础环节，能稳定输出时间复杂度较低的解决方案。更重要的是，你形成了一套自我评估标准，知道自己在哪些领域具备竞争力，哪些领域还需持续深耕。两周时间虽短，但若执行到位，足以让你在面试中展现出远超普通候选人的逻辑清晰度与问题处理能力。

请注意，面试技巧与沟通表达同样重要。刷题解决的是“懂不懂”的问题，而“怎么说”需要模拟面试来打磨。建议配合找伙伴互访模拟，将书面答案转化为口头表达，避免“代码写得对，但说不清楚”的尴尬。两周刷完是底线，深度消化才是目的。

mksz562-两周刷完100道前端优质面试真题[完结]

本课程隶属 会员库 · MK实战课（一部分是老课） / 课程盒子5-mksz500至599，完整课程目录与配套资料如下。

课程目录

第10章 前端面试技能拼图8： 项目设计 - 能否成为项目负责人/
10-1 章节介绍_慕课网.pdf
10-10 -设计一个H5编辑器的数据模型和核心功能-演示正确答案_ev.mp4
10-11 -设计一个“用户-角色-权限”的模型和功能_ev.mp4
10-12 -简单描述hybrid模板的更新流程_ev.mp4
10-13 -开发一个H5抽奖页，需要后端提供哪些接口_ev.mp4
10-14 -如果你是前端技术负责人，将如何做技术选型_ev.mp4
10-15 -设计实现一个H5图片懒加载SDK_ev.mp4
10-16 扩展知识补充：我们常说的 B 端和 C 端，有什么区别_慕课网.pdf
10-17 重点及注意事项总结_慕课网.pdf
10-2 扩展：如果你是一个项目的前端技术负责人，你的主要职责是什么？_慕课网.pdf
10-3 -开始-学习要点和注意事项_ev.mp4
10-4 -如何设计一个前端统计SDK-分析功能范围_ev.mp4
10-5 -如何设计一个前端统计SDK-代码结构演示_ev.mp4
10-6 -【连环问】sourcemap有何作用，如何配置_ev.mp4
10-7 -SPA和MPA应该如何选择_ev.mp4
10-8 -设计一个H5编辑器的数据模型和核心功能-错误答案展示_ev.mp4
10-9 扩展知识补充：何时应该使用 SSR ，何时不用？_慕课网.pdf
第11章 前端面试技能拼图9： 软技能 - 沟通、总结和学习能力/
11-1 章节介绍_慕课网.pdf
11-2 -开始-学习要点和注意事项_ev.mp4
11-3 -你是否看过“红宝书”-_ev.mp4
11-4 -如何做Code-review，要考虑哪些内容_ev.mp4
11-5 -如何学习一门新语言，需要考虑哪些方面_ev.mp4
11-6 -你觉得自己还有哪些不足之处？_ev.mp4
11-7 重点及注意事项总结_慕课网.pdf
第1章 课程简介/
1-1 导学[4].mp4
第2章 前端面试技能拼图1 ：数据结构和算法（上），大厂面试必考/
2-10 使用 JS 反转单向链表-分析解题思路[4].mp4
2-11 使用 JS 反转单向链表-代码演示和单元测试[4].mp4
2-12 【连环问】链表和数组哪个实现队列更快-分析解题思路[4].mp4
2-13 【连环问】链表和数组哪个实现队列更快-代码演示和单元测试[4].mp4
2-14 【连环问】链表和数组哪个实现队列更快-性能分析[4].mp4
2-15 用 JS 实现二分查找-分析时间复杂度[4].mp4
2-16 用 JS 实现二分查找-代码演示和单元测试[4].mp4
2-17 用 JS 实现二分查找-递归和循环哪个更好[4].mp4
2-18 找出一个数组中和为 n 的两个数-嵌套循环不是最优解[4].mp4
2-19 找出一个数组中和为 n 的两个数-双指针的思路[4].mp4
2-2 开始-学习要点和注意事项[4].mp4
2-20 找出一个数组中和为 n 的两个数-双指针的代码演示[4].mp4
2-3 科普-时间复杂度[4].mp4
2-4 科普-空间复杂度[4].mp4
2-5 把一个数组旋转 k 步-代码演示和单元测试[4].mp4
2-6 把一个数组旋转 k 步-性能分析[4].mp4
2-7 判断一个字符串是否括号匹配[4].mp4
2-8 用两个栈实现一个队列[4].mp4
2-9 使用 JS 反转单向链表-什么是链表[4].mp4
第3章 前端面试技能拼图1： 数据结构和算法（下），大厂面试必考/
3-1 求二叉搜索树的第K小值-二叉树和三种遍历[4].mp4
3-10 获取字符串中连续最多的字符以及次数-使用嵌套循环[4].mp4
3-11 获取字符串中连续最多的字符以及次数-使用双指针[4].mp4
3-12 获取字符串中连续最多的字符以及次数-正则表达式很慢[4].mp4
3-13 用 JS 实现快速排序并说明时间复杂度-代码演示和单元测试[4].mp4
3-14 -用JS实现快速排序并说明时间复杂度-性能分析[4].mp4
3-15 -获取1-10000之前所有的对称数（回文数）-代码演示和单元测试[4].mp4
3-16 -获取1-10000之前所有的对称数（回文数）-性能分析[4].mp4
3-17 -如何实现高效的英文单词前缀匹配[4].mp4
3-18 用 JS 实现数字千分位格式化[4].mp4
3-19 -用JS 切换字母大小写[4].mp4
3-2 求二叉搜索树的第K小值-解题[4].mp4
3-20 -为什么0.1+0.2!==0.3[4].mp4
3-3 为什么二叉树很重要，而不是三叉树四岔树[4].mp4
3-4 堆有什么特点，和二叉树有什么关系[4].mp4
3-5 求斐波那契数列的第n值-递归算法会导致运行崩溃[4].mp4
3-6 -求斐波那契数列的第n值-优化时间复杂度-part1[4].mp4
3-7 【连环问】青蛙跳台阶有几种方式[4].mp4
3-8 移动 0 到数组的末尾-splice 会导致性能问题[4].mp4
3-9 移动 0 到数组的末尾-使用双指针[4].mp4
第4章 前端面试技能拼图2 ：前端基础知识 ， 必知必会/
4-10 -JS中for-in和for-of有什么区别[4].mp4
4-11 -【连环问】for-await-of有什么作用[4].mp4
4-12 -offsetHeight-scrollHeight-clientHeight有什么区别[4].mp4
4-13 -HTMLCollection和NodeList有什么区别[4].mp4
4-14 -Vue中computed和watch有什么区别[4].mp4
4-15 -Vue组件通讯有几种方式，尽量全面-props-emits和自定义事件[4].mp4
4-16 -Vue组件通讯有几种方式，尽量全面-props-$attrs[4].mp4
4-17 -Vue组件通讯有几种方式，尽量全面-props-$parent和$refs[4].mp4
4-18 -Vue组件通讯有几种方式，尽量全面-props-provide和inject[4].mp4
4-19 -Vuex中action和mutation有什么区别[4].mp4
4-20 -JS严格模式有什么特点[4].mp4
4-21 -HTTP跨域时为何要发送options请求[4].mp4
4-3 开始-学习要点和注意事项[4].mp4
4-4 Ajax-Fetch-Axios三者有什么区别[4].mp4
4-5 -防抖和节流有什么区别，分别用于什么场景-防抖[4].mp4
4-6 -防抖和节流有什么区别，分别用于什么场景-节流[4].mp4
4-7 -px-%-em-rem-vw-vh有什么区别[4].mp4
4-8 -什么时候不能使用箭头函数[4].mp4
4-9 请描述 TCP 三次握手和四次挥手[4].mp4
第5章 前端面试技能拼图3 ：知识深度 - 原理和源码/
5-10 -浏览器和nodejs事件循环（Event Loop）有什么区别-nodejs[4].mp4
5-11 -虚拟DOM（vdom）真的很快吗[4].mp4
5-12 -遍历一个数组用for和forEach哪个更快[4].mp4
5-13 -nodejs如何开启多进程，进程如何通讯-进程和线程的区别[4].mp4
5-14 -nodejs如何开启多进程，进程如何通讯-使用child_process.fork方式[4].mp4
5-15 -nodejs如何开启多进程，进程如何通讯-使用cluster方式[4].mp4
5-16 -请描述js-bridge的实现原理[4].mp4
5-17 -requestIdleCallback和requestAnimationFrame有什么区别[4].mp4
5-18 -Vue每个生命周期都做了什么[4].mp4
5-19 -Vue2和Vue3和React三者的diff 算法有什么区别[4].mp4
5-20 -Vue-router的MemoryHistory是什么[4].mp4
5-3 -开始-学习要点和注意事项[4].mp4
5-4 -JS内存垃圾回收用什么算法[4].mp4
5-5 -【连环问】JS闭包是内存泄漏吗[4].mp4
5-6 -如何检测JS内存泄漏[4].mp4
5-7 -JS内存泄漏的场景有哪些[4].mp4
5-8 -JS内存泄漏的场景有哪些-扩展-WeakMap和WeakSet[4].mp4
5-9 -浏览器和nodejs事件循环（Event Loop）有什么区别-浏览器[4].mp4
第6章 前端面试技能拼图4： 知识广度 - 从前端到全栈/
6-10 【连环问】HTTP协议1.0和1.1和2.0有什么区别[4].mp4
6-11 什么是HTTPS中间人攻击，如何预防[4].mp4
6-12 script标签的defer和async有什么区别[4].mp4
6-13 【连环问】prefetch和dns-prefetch分别是什么[4].mp4
6-14 前端攻击手段有哪些，该如何预防-part1[4].mp4
6-15 前端攻击手段有哪些，该如何预防-part2[4].mp4
6-16 WebSocket和HTTP协议有什么区别[4].mp4
6-17 WebSocket和HTTP协议有什么区别-扩展-创建简易聊天室[4].mp4
6-18 【连环问】WebSocket和HTTP长轮询的区别[4].mp4
6-19 从输入URL 到网页显示的完整过程[4].mp4
6-2 开始-学习要点和注意事项[4].mp4
6-20 【连环问】网页重绘repaint和重排reflow有什么区别[4].mp4
6-21 如何实现网页多标签tab通讯[4].mp4
6-22 【连环问】如何实现网页和iframe之间的通讯[4].mp4
6-23 请描述koa2的洋葱圈模型[4].mp4
6-3 移动端H5点击有300ms延迟，该如何解决[4].mp4
6-5 HTTP请求中token和cookie有什么区别-cookie和session[4].mp4
6-6 HTTP请求中token和cookie有什么区别-token和JWT[4].mp4
6-7 【连环问】session和JWT哪个更好[4].mp4
6-8 【连环问】如何实现SSO单点登录[4].mp4
6-9 HTTP协议和UDP协议有什么区别[4].mp4
第7章 前端面试技能拼图5 ：实际工作经验 - 是否做过真实项目 - 副本/
7-10 在实际工作中，你对React做过哪些优化-上集[4].mp4
7-11 在实际工作中，你对React做过哪些优化-下集[4].mp4
7-12 【连环问】你在使用React时遇到过哪些坑[4].mp4
7-13 如何统一监听Vue组件报错[4].mp4
7-14 如何统一监听React组件报错[4].mp4
7-15 如果一个H5很慢，如何排查性能问题-通过Chrome Performance分析[4].mp4
7-16 如果一个H5很慢，如何排查性能问题-使用lighthouse分析[4].mp4
7-17 工作中遇到过哪些项目难点，是如何解决的[4].mp4
7-2 开始-学习要点和注意事项[4].zip
7-3 H5页面如何进行首屏优化[4].mp4
7-4 后端一次性返回10w条数据，你该如何渲染[4].mp4
7-7 【连环问】观察者模式和发布订阅模式的区别.mp4
7-9 【连环问】你在使用Vue过程中遇到过哪些坑.mp4
第8章 前端面试技能拼图6： 编写高质量代码 - 正确，完整，清晰，鲁棒/
8-1 章节介绍_慕课网.pdf
8-10 【连环问】深度优先遍历可以不用递归吗_ev.mp4
8-11 手写一个LazyMan，实现sleep机制_ev.mp4
8-12 手写curry函数，实现函数柯里化_ev.mp4
8-13 instanceof原理是什么，请写代码表示_ev.mp4
8-14 手写函数bind功能_ev.mp4
8-15 【连环问】手写函数call和apply功能_ev.mp4
8-16 手写EventBus自定义事件-包括on和once_ev.mp4
8-17 手写EventBus自定义事件-on和once分开存储_ev.mp4
8-18 手写EventBus自定义事件-单元测试_ev.mp4
8-19 用JS实现一个LRU缓存-分析数据结构特点，使用Map_ev.mp4
8-2 前导：高质量代码的核心要素_慕课网.pdf
8-20 用JS实现一个LRU缓存-代码演示和单元测试_ev.mp4
8-21 【连环问】不用Map实现LRU缓存-分析问题，使用双向链表_ev.mp4
8-22 【连环问】不用Map实现LRU缓存-代码演示_ev.mp4
8-23 手写JS深拷贝-考虑各种数据类型和循环引用_ev.mp4
8-24 扩展补充：根据一个 DOM 树，写出一个虚拟 DOM 对象_慕课网.pdf
8-25 重点及注意事项总结_慕课网.pdf
8-3 开始-学习要点和注意事项_ev.mp4
8-4 手写一个JS函数，实现数组扁平化Array Flatten_ev.mp4
8-5 【连环问】手写一个JS函数，实现数组深度扁平化_ev.mp4
8-6 手写一个getType函数，获取详细的数据类型_ev.mp4
8-7 new一个对象的过程是什么，手写代码表示_ev.mp4
8-8 深度优先遍历一个DOM树_ev.mp4
8-9 广度优先遍历一个DOM树_ev.mp4
第9章 前端面试技能拼图7 ：分析和解决问题的思路 - 可以独立解决问题/
9-1 章节介绍_慕课网.pdf
9-10 -React-setState是微任务还是宏任务_ev.mp4
9-11 -读代码-对象和属性的连续赋值_ev.mp4
9-12 -读代码-对象属性类型的问题_ev.mp4
9-13 扩展补充：解决问题的常见思路_慕课网.pdf
9-14 重点及注意事项总结_慕课网.pdf
9-2 开始-学习要点和注意事项_ev.mp4
9-3 [1, 2, 3].map(parseInt)_ev.mp4
9-4 -读代码-函数修改形参，能否影响实参？_ev.mp4
9-5 -把一个数组转换为树_ev.mp4
9-6 -【连环问】把一个树转换为数组_ev.mp4
9-7 -读代码-构造函数和原型的重名属性_ev.mp4
9-8 -一道让人失眠的promise-then执行顺序问题_ev.mp4
9-9 -读代码-React-setState经典面试题_ev.mp4
资料/
资料.zip