前端八股知识全景

7 分钟

一、前端八股知识全景

如果系统性地准备，我建议将八股分为以下几个模块：

  • 🎨 CSS：在中小厂及注重C端体验的业务中考察较多，面试越初级，考察得越多。
  • 🟨 JS (JavaScript)：重中之重，压舱基石。无论什么面试，JS都是考察的绝对核心。
  • 🌐 浏览器与网络安全：考察频次极高。高频八股相对好背，但面试官更喜欢结合场景和性能优化来考察你的理解深度。
  • 🖼️ 框架 (Vue / React)：通常与你的项目强相关。此外，对比类问题是高频考点（如 Vue2 vs Vue3），涉及到技术选型的思考。
  • 🛠️ 前端工程化：非常硬核的加分项。如果能结合场景和实战经验回答，往往能成为面试的胜负手。
  • 🧬 简历强相关：这部分因人而异，比如你简历上写了“熟悉跨端开发”或“有丰富的性能优化经验”，就必须准备好被深挖。
  • 🤖 AI 相关 (2026新趋势)：你也许会问：前端为什么要问AI？实际上，我秋招几乎每一轮都被问到了AI相关问题（应用、提效、原理等）。强烈建议花点时间准备，这会是你区别于其他候选人的亮点。

二、八股速通路线

八股浩如烟海，全部背诵不现实。我的经验是，先拿下最高频、最核心的20%问题，然后“以战养战”，通过实际面试来查漏补缺，反哺自己的知识库。

切记：背标准答案毫无意义。能够用费曼学习法，把一个知识点清晰地讲给别人听，才算初步掌握。

🎨CSS

🟨JS (JavaScript)

🌐浏览器和网络安全

  • 从URL输入到页面展示：DNS→TCP→HTTP→解析→渲染全链路
  • 跨域与同源策略：同源策略原理、CORS、JSONP、代理等跨域方案
  • 浏览器缓存：强缓存和协商缓存的区别、触发时机和相关头部字段
  • 本地存储方案对比：cookie/localStorage/sessionStorage/IndexedDB 区别与适用场景
  • HTTP核心知识：常用状态码、GET vs POST、常用请求/响应头、RESTful规范
  • HTTPS：加密原理，如何保证安全（对称/非对称加密，数字证书）
  • Web安全攻防：XSS/CSRF原理、区别、防御手段、CSP策略
  • HTTP版本：HTTP/1.0, 1.1, 2.0, 3.0 的主要区别
  • 登录与鉴权：Token认证全流程、JWT原理、OAuth2.0、Session vs Token对比
  • CDN加速原理：CDN工作机制、DNS调度、缓存策略、回源逻辑
  • SSR vs CSR：服务端渲染与客户端渲染的区别、优缺点、同构方案

🖼️框架

Vue

  • Vue核心原理：响应式原理（defineProperty vs Proxy）、虚拟DOM与Diff、key的作用、nextTick、keep-alive
  • Vue生态对比：Vue2 vs Vue3、Pinia vs Vuex、Options API vs Composition API
  • Vue组件通信：props/emit、v-model、provide/inject、EventBus、Pinia/Vuex
  • Vue vs React：设计理念、响应式 vs 单向数据流、模板 vs JSX、生态对比

React

  • React核心原理：JSX本质、虚拟DOM与Fiber架构、Diff算法、Hooks原理（useState/useEffect）、状态管理思路

🛠️前端工程化

🏃性能优化

🤖AI 相关