面试前快速过一遍下面这些高频考点，能答出关键词就能撑起大部分前端面试。

CSS / 布局

选择器优先级：!important > 内联(1000) > ID(0100) > 类/属性/伪类(0010) > 元素/伪元素(0001) > 通配符(0000)。
BFC：块级格式化上下文，独立渲染容器。触发：overflow 非 visible、float、绝对定位、inline-block、flex、display: flow-root（最干净的触发方式）。用途：清除浮动、阻止 margin 重叠、自适应两列。
盒模型：content-box（标准，宽高=内容）vs border-box（IE/常用，宽高含 padding+border）。
水平垂直居中：首选 flex（justify-content + align-items: center）或 grid（place-items: center），其次 absolute + transform: translate(-50%,-50%)。
自适应两列：左定宽右自适应用 flex 或 grid，老写法 float + overflow（触发 BFC）。

JS 核心

类型判断：typeof（原始类型，但 null 返回 object）、instanceof（原型链）、Object.prototype.toString.call()（最准）、Array.isArray()。
作用域链 / 闭包：函数定义时确定作用域，沿链向上查找变量；闭包=函数+其引用的外部变量。
this 绑定：默认/隐式/显式(call/apply/bind)/new，箭头函数无自身 this。
原型与继承：ES5 寄生组合继承；ES6 用 class + extends + super。
Event Loop：同步栈清空 → 微任务队列清空（Promise.then、MutationObserver、queueMicrotask）→ 一个宏任务（setTimeout、I/O、UI 渲染）→ 循环。Node 分 timers/poll/check 等阶段，process.nextTick 优先级最高。
防抖/节流：防抖=只执行最后一次（搜索联想）；节流=固定频率执行（滚动、resize）。

框架

Vue 响应式：Vue2 用 Object.defineProperty 劫持 getter/setter（无法监听新增属性/数组下标，需 $set）；Vue3 用 Proxy，可监听整个对象、性能更好。
vdom + diff：用 JS 对象描述 DOM，diff 同层比较（O(n)），靠 key 复用节点。
React setState：是否异步取决于批处理上下文（React 18 起默认全场景自动批处理）；连续多次状态更新合并为一次重渲染。
React 性能优化：React.memo、useMemo、useCallback、列表稳定 key、useTransition（并发特性）。

网络 / 缓存 / 安全

HTTP/2 vs HTTP/1.1：多路复用、二进制分帧、HPACK 头压缩、服务端推送；HTTP/3 改用基于 UDP 的 QUIC，解决队头阻塞。
跨域：同源策略限制，解决方案 CORS（主流）、代理（dev server / Nginx）、postMessage、JSONP（仅 GET，已过时）。
缓存：强缓存（Cache-Control/Expires，不发请求）→ 协商缓存（ETag/Last-Modified，304）。
XSS：注入脚本，防御=输出转义 + CSP；CSRF：伪造请求，防御=SameSite Cookie + CSRF Token + 校验来源。

工程化 / 性能

首屏优化：路由懒加载 + 代码分割、资源压缩、CDN、HTTP 缓存、SSR/预渲染、图片懒加载与压缩、骨架屏。
回流/重绘：合并 DOM 操作、用 class 批量改样式、transform/opacity 走合成层、读写分离避免强制同步布局。
Webpack：从入口构建依赖图，loader 转换文件、plugin 介入生命周期；现代可换 Vite（基于 esbuild/Rollup，dev 用原生 ESM 免打包）。

面经-前端面经汇总

简版速记