前言

本人毕业三年，近期由于一些外界不可抗因素导致了公司的大规模裁员，通过了两三周的面试准备，最终收获了字节、快手、美团、滴滴、虾皮等公司的offer，在这里总结下经验。

经验总结

我简单的把面试分了四个部分，然后针对每个部分做下详细的介绍。

• 技术面-基础
• 技术面-算法、数据结构
• 技术面-项目
• hr面-综合

基础知识部分

基础知识部分是最重要的，虽然不是应届生了，但是八股文还是必不可少的。我自己的方法是通过刷牛客里大量一二线公司的面经，然后再把相关问题和答案进行分类并总结到文档里记录下来。下面再总结下我最近遇到的面试题，并对出现频率的进行标注，其中没标注的是我准备了但是没有遇到。

网络

http我准备了很多，但是其实问的比较少，基本都是问https、http2、跨域、缓存相关的，也没人问http3。

1. 网络分层（低频）
2. http和https区别（低频）
3. https相关，要知道加密过程、哪部分是对称加密和非对称加密、中间人攻击、证书作用（高频）
4. tcp的长连接和短连接
5. http2的介绍以及多路复用的原理（高频）
6. http3的介绍以及解决了http2的什么问题
7. tcp和udp区别
8. tcp如何保证可靠性
9. 拥塞控制和流量控制
10. http报文的请求和返回会有几个部分（请求行、请求头、请求体）；每部分具体都有什么（常见的请求头）（低频）
11. 所有状态码
12. GET和POST的区别
13. 输入url到页面加载全过程
14. http缓存控制（强缓存、弱缓存）、相关的http请求头、相关状态码（高频）
15. 对跨域的了解和解决方法（高频）
16. cors的返回头、cors预请求，什么时候会出发预请求（低频）
17. 三次握手四次挥手，为什么三次和四次

css

css问的很少，只要会写常见的布局就ok。

1. 盒模型（低频）
2. BFC（低频）
3. positon的值，都是根据什么定位
4. flex的各个属性
5. 垂直居中布局
6. 手写个两栏布局（低频）
7. 什么css可以减少重绘
8. visibility、display、opacity的区别（低频）
9. css的优化方法（低频）
10. css-loader、less-loader、style-loader作用（低频）

js

重中之重，没啥可说的刷题就完事了，像this指向、事件循环都会出题让你看输出结果，像节流防抖、bind、promise之类的都要会手写。这里就不标必考了，因为大部分都是重点。

1. ts优点
2. interface和type区别
3. js 数据类型
4. 判断元素类型的方法
5. 基本类型和引用类型相关（堆栈）
6. 0.1 + 0.2 === 0.3
7. instanceof 原理（手写）
8. Set Map WeakSet WeakMap 区别
9. 实现深拷贝及处理循环引用和特殊类型（手写）
10. 变量提升
11. let、const和var的区别
12. this指向（做题）
13. bind、call、apply（手写）
14. new原理（手写）
15. 原型、原型链（做题）
16. 创建对象的方法
17. 继承方法
18. 闭包
19. 垃圾回收
20. js事件循环介绍（做题）
21. node 事件循环
22. 事件冒泡
23. 防抖节流（手写）
24. localstorage、sessionstorage（多标签是否共用）、cookie（各个属性作用）、indexdb
25. service worker 和 webworker
26. Proxy和Object.defineProperty
27. 前端模块化
28. commonjs 和 esmodule 区别
29. 回流重绘，用 clientTop 和 clinetLeft 为什么会导致浏览器重排？
30. defer 和 async
31. 浏览器进程和线程
32. cdn原理
33. 设计模式
34. 前端性能优化
35. 前端白屏原因
36. 前端监控
37. 实现数组去重
38. 实现数组扁平化和变形（指定深度）
39. 实现对象扁平化
40. Promise.all和Promise.allSettled实现
41. 累加器实现 add(1,2)(3)
42. 实现compose
43. 实现node洋葱模型
44. 实现reduce
45. 用Promise实现串行
46. 实现一个compare函数

框架相关(react webpack)

由于我用的react框架，所以面试也问的相关问题，一定要了解下框架的相关原理，同时webpack也是必考点。框架问题非常重要，这里也不标必考了，因为大部分都是重点。

1. React介绍、优点
2. React生命周期及最新版本和hooks怎么用什么替代生命周期
3. 介绍diff算法
4. 介绍虚拟dom、为什么用虚拟dom
5. 组件间的通信方式
6. redux介绍和原理
7. 中间件原理
8. 高阶组件、纯函数、副作用
9. immutable原理
10. setState什么时候异步、什么时候同步、为什么
11. React Fiber介绍及原理
12. React hooks介绍及原理
13. 有什么常见hooks
14. useMemo和useCallback原理
15. 实现useState和useEffect
16. hooks实现防抖、节流、useprevious
17. hooks优缺点
18. React优化方式
19. webpack介绍、整理的一个流程
20. 用过什么webpack的loader和plugin
21. webpack的loader和plugin的原理及区别
22. webpack热更新原理
23. webpack优化前端性能
24. treeshaking原理
25. babel原理
26. rollup和vite
27. npm install 过程

算法、数据结构部分

感觉前端对算法题要求其实不是很高，只要把不同类型常见的题看下基本就没问题。

1. 快速排序
2. 洗牌算法
3. 给定数组中随机取n个数
4. 回文字符串
5. 最长回文字符串
6. 最长不重复子字符串
7. 数组公共前缀
8. 两数之和、k sum
9. 数组全排列
10. 爬楼梯
11. 螺旋矩阵
12. 大数相加
13. 二分查找
14. 二叉树前中后遍历
15. 二叉树层次遍历
16. 二叉树深度优先遍历(递归、非递归)
17. 二叉树广度优先遍历(递归、非递归)
18. 数组转树
19. 和为n的二叉树路径
20. 二叉树深度
21. 二叉树是否对称
22. 链表反转
23. 链表倒数第k个
24. 16进制转10进制

项目部分

项目介绍（难点和优化）一定要提前准备，如果你介绍的项目有一定的难度和深度会很加分。我一般介绍的都是偏工程的技术项目，感觉业务项目难点不多介绍的会少一些。

1. 介绍下你项目的难点和遇到的困难
2. 如果现在再看这个项目你会做哪些优化
3. 项目后续规划
4. 深挖项目细节

hr部分

能到hr大概率就是过了，hr部分基本不会刷人，但是常见的问题也需要想想怎么说。谈薪阶段也是非常重要的，现在很多公司都要看别人出多少他们才出，所以手里多拿几个大厂高薪offer的话还挺重要的。

1. 为什么换工作
2. 找工作比较看重什么
3. 介绍下你的项目
4. 为什么学前端
5. 近三年职业规划
6. 手里有哪些offer、期望薪资

总结

我整体的准备流程如下：

1. 准备简历和所有项目的介绍
2. 刷大量面经并在文档对各个知识点进行归纳总结
3. 手写常见算法
4. 反复看总结的知识点加深印象
5. 投简历

三年左右经验其实更要求知识点的底层原理和项目的深度，只要把常见的基础面试题都总结好再准备几个稍微亮眼的项目就基本没什么问题。

最后再说说前司，虽然被裁员了，但是也理解公司。最近在面试的时候也有很多hr问我后不后悔当时选择了猿辅导，我的回答都是不后悔。在猿辅导的这几年感觉氛围非常好，自己收获了很多，也认识了很多朋友。最后也真心的祝小猿能够活下来。