简版速记

面试高频考点快速索引，括号内为核心答题要点。

JS 核心

原型链：对象 → __proto__ → 构造函数 .prototype → … → null
instanceof：沿原型链逐层检查 __proto__ === Constructor.prototype
call/apply 区别：均改变 this，call 传参列表，apply 传数组
new 四步：创建空对象 → 绑定原型 → 执行构造函数 → 返回对象（非对象时）
闭包：函数 + 其词法作用域；用于封装/记忆，注意内存泄漏
0.1+0.2≠0.3：IEEE 754 双精度浮点精度问题，用 Number.EPSILON 做误差比较
事件循环：调用栈 → 微任务队列（Promise/queueMicrotask）→ 宏任务队列（setTimeout/setInterval）
变量提升：var 声明提升到函数顶部；let/const 有暂时性死区（TDZ）
模块化：CommonJS（require 同步/运行时）/ ESM（import 静态分析，支持 tree-shaking）

CSS 核心

BFC：独立渲染区域，overflow:hidden/auto、display:flex/grid、position:absolute/fixed 触发；用于清除浮动、防 margin 折叠
盒模型：content-box（标准）vs border-box（IE/实际常用）
优先级：!important > inline > ID(100) > class/属性/伪类(10) > 标签(1)
重排 vs 重绘：改变布局属性触发重排（代价大）；只改颜色触发重绘；用 transform/opacity + will-change 走合成层

React 核心

Fiber：链表结构，可中断/恢复渲染，时间切片（scheduler）
setState 批处理：React 18 起所有场景均自动批处理（包括异步回调），之前版本仅在合成事件中批处理
diff 算法：O(n)，同层比较 + key 复用
Hooks 原则：不能在条件/循环中调用；useEffect 依赖数组控制副作用时机
性能优化：React.memo、useMemo、useCallback、虚拟列表、Code Splitting

HTTP/网络核心

301 永久重定向（SEO 友好）；302/307 临时重定向（307 保留请求 method）
HTTPS 握手：TCP 握手 → TLS（证书验证 → 密钥协商 → 对称加密通信）
HTTP/2：多路复用、头部压缩（HPACK）、服务器推送、二进制帧
HTTP/3：基于 QUIC（UDP），解决 HTTP/2 TCP 层队头阻塞，支持 0-RTT 连接
TCP 三次握手：SYN → SYN-ACK → ACK（确认双方收发能力）

工程化核心

Webpack loader：链式右→左执行，转换文件内容
tree-shaking：基于 ESM 静态分析，打包时删除未引用代码
babel：源码 → AST（词法/语法分析）→ transform 插件 → 生成目标代码

其他问题

JS

解释一下原型链
instanceof原理
apply和call的作用及区别
说下你对DOM树的理解
实现 add(1)(2)(3)
es5实现继承
说下generator原理
实现一个promise
说下事件模型
bind的实现
闭包的作用和原理
0.1+0.2为什么不等于0.3
前端模块化机制有哪些
谈谈变量提升
new操作符具体做了什么
谈下事件循环机制
谈谈你对作用域的理解
v8垃圾回收机制
合并二维有序数组成一维有序数组
实现一个trim方法
什么场景下会用策略模式
判断括号字符串是否有效
判断链表是否有环
爬楼梯问题
实现一个发布订阅模式
实现一个斐波那契数列

CSS

CSS选择器有哪些
什么是BFC，BFC有什么作用，如何形成BFC
position有哪些值，作用分别是什么
flex布局有什么好处
介绍下盒子模型
有哪些方式可以使div居中
css优先级是怎么计算的
CSS相关的性能优化
双飞翼/圣杯布局
浮动元素会造成什么影响，如何清除浮动
CSS样式隔离手段
行内元素、块级元素有哪些，区别是什么
CSS3有哪些新特性
层叠上下文是什么
重排和重绘是什么，有什么区别
动画性能如何优化

react

react16新增了哪些生命周期、有什么作用，为什么去掉某些15的生命周期
react setState是同步还是异步

补充（现代做法）：React 18 引入 createRoot 后，所有 setState 均默认自动批处理（包括 setTimeout、Promise 回调），不再区分同步/异步场景。若需强制立即刷新，可使用 flushSync。

什么是高阶组件，请举例说明
react合成事件是什么，和原生事件的区别
为什么有时react两次setState，只执行一次
redux有哪些原则
redux和redux-saga的区别和原理
react如何处理异常
react为什么需要fiber
redux中间件机制
redux compose函数做什么的
redux-saga是什么，和redux-thunk有什么区别
redux的理念(说了下action dispatch state啥的，单向数据流)
react-redux中connect怎么实现(高阶组件、context注入store、subscribe订阅store数据变化)
mixin hoc 继承的区别，优缺点
useEffect的实现原理
异步渲染和旧版的diff的区别
react diff如何实现
react 旧版的diff用深度优先还是广度优先。为什么用深度优先，广度优先能实现吗
diff的时间复杂度？为什么？(o(n)。提了下react优化o(n3)->o(n))
react fiber有哪些优点，怎样做到的？如何实现异步渲染（链表/可中断）
react有哪些性能优化的点
setState和hook的区别
react-router实现原理(hash/html5 history)
客户端路由hash/history实现的区别、原理
实现一个useState

Vue

vue的数据绑定机制是如何实现的
vue next tick实现原理
vue的computed和watch的区别
说下vue的keep alive
vue/react技术选型

工程化

是否有写过webpack插件
webpack工作流程是怎样的
谈下webpack loader机制
node模块机制是怎样的
node require具体实现是什么
node事件循环与浏览器的哪些不一样
node的异常处理方式
tree shaking是什么，有什么作用，原理是什么
babel是什么，怎么做到的
babel实现转码的过程（词法/语法分析）
项目的技术栈怎么选型

补充（现代做法）：2024 年前端构建工具格局已发生显著变化。Vite（基于 Rollup/esbuild）已成为新项目首选，冷启动速度比 webpack 快 10–100 倍。webpack 仍在大型存量项目中使用，Turbopack（webpack 继任者，Rust 实现）已集成进 Next.js 15。面试时可主动提及 Vite 的 ESM 原生开发服务器原理。

HTTP

常用的http状态码(101 200 204 301 302 304 307 400 404 500...)
http 302 301 307之间的区别
301和302对于seo来说哪个更好 (301)
https加密过程是怎样的
http2.0做了哪些改进
TCP3次握手过程
http2.0有哪些不足，http3.0是什么

补充（现代做法）：HTTP/3 基于 QUIC 协议（UDP），已于 2022 年成为正式 RFC（RFC 9114）。主流浏览器与 CDN（Cloudflare、Fastly 等）均已支持。QUIC 彻底解决了 HTTP/2 的 TCP 层队头阻塞，并支持连接迁移（切换网络不断连）和 0-RTT 握手。