前端面试题合集
内容定位
这里按真实面试节奏整理前端核心考点:先给 30~60 秒可直接口述的“快速回答”,再用“深入解答”补充原理、代码、工程边界和追问。适合中级前端岗位系统复习,也可用高级追问继续向源码与架构取舍延伸。
手写题按“最小正确版 → 面试进阶完整版”展开;框架题先说主链路,再拆关键代码;算法题从直观方案推进到优化方案,并明确不变量、复杂度和输入边界。
快速导航
| 方向 | 核心内容 | 推荐入口 |
|---|---|---|
| HTML 与 CSS | 语义化、表单、布局、响应式、重排重绘 | HTML 语义化 · CSS 盒模型 |
| JavaScript | 作用域、原型、异步、手写工具与安全 | 闭包 · 防抖与节流 |
| TypeScript | 类型系统、泛型、工具类型与装饰器 | TypeScript 介绍 |
| 浏览器与网络 | 渲染、V8、GC、HTTP、缓存、跨域与安全 | 浏览器渲染 · HTTP 地址 |
| Vue | Vue 2 高频机制、Vue 3 响应式与调度源码 | Vue 2 组件通信 · Vue 3 高频题 |
| React | 生命周期、Hooks、状态管理、路由与性能 | React 生命周期 · 列表 key |
| Node.js | 事件循环、流、Buffer、框架、Koa 与鉴权 | Node.js 框架 · Koa |
| 工程化 | Webpack、Vite、性能优化、设计模式与 Electron | Webpack · 性能优化 |
| 算法 | 高频数据结构、解题模式、边界与复杂度 | 2026 高频算法 |
学习路径
短期面试冲刺
按 JavaScript → 浏览器与网络 → 目标框架 → 工程化 → 算法的顺序复习。第一遍只口述“快速回答”,第二遍专门处理答不完整的深入部分,第三遍闭卷写重点代码并跑边界用例。
系统查漏补缺
先学习现代 JavaScript 教程,再进入TypeScript 教程,最后回到框架和工程专题。这样能先建立语言运行时模型,再理解类型约束、响应式系统和构建工具。
高级追问准备
重点阅读事件循环、Promise、深拷贝、浏览器渲染、框架响应式/调度、构建性能与设计模式。回答时先说明结论和适用条件,再谈源码主链路、失败场景和替代方案。
阅读约定
- 代码示例默认面向现代浏览器或当前 LTS Node.js;伪代码、输出和多文件示例会使用准确围栏标记。
- 版本敏感内容会给出版本基线、核对日期或固定官方源码链接。
- “完整实现”指适合面试讨论的健壮进阶版,不代表复制语言规范、框架源码或生产库的全部行为。
