36场面试，通过了33场…

2022今年这个行情实属不易。以下是来自一位吉林大学（已保研）一位前端大佬，虽说今年旱的旱死，涝的涝死，但是这位大佬可谓是大厂offer收割机。或不多说，下面是他的个人介绍：

• 基本情况
• 个人情况
• 技术选型
• 用人标准出发
• 1.计算机网络
• 2.操作系统
• 3.浏览器运行机制
• 4.javaScript/typeScript
• 5.前端工程化
• 6.跨端
• 7.代码题
• 8.计算机图形学
• 9.更多
• 10.关于思考
• 最后
• 反思总结

基本情况

今年的秋招已近尾声，在整个秋招的过程中呢，我一共参加了3+1+2+4+5+4+3+3+2+4+3+2=36场面试，面试的公司覆盖字节跳动、阿里巴巴、蚂蚁金服、美团、华为、小红书、同花顺、4399，最终通过了其中33场。。

第一次是字节data三面挂，知识有漏洞；第二次是字节剪映1面和面试官沟通不畅挂：第三次是4399hr面薪资要太多了挂；

……

从此后一路乱杀，开奖了满意的offer，不得不说互联网大厂的薪资依旧是具有强吸引力的。

个人情况

简单介绍下背景：末流985(JLU)非科班，0实习经历。主修电子，辅修计算机，不过项目经历较多，技术栈比较宽领域，嵌入式、前端、后端都能做，倒不是刻意转码，选择前端只是因为热爱。

在这么多轮的面试中，我也算是积累了相对全面的面试经验，特此呢进行一个简单的复盘总结与分享罢。

下面我将从几个角度对秋招进行一个简单的解读剖析。

技术选型

1. 第一点从互联网本身展开，这点很重要，直接影响的是技术路线的选型。今年算是互联网的大寒冬，行业的不景气以及求职的人太多导致了严重的资源内卷，对于教学资源相对更集中的后端以及算法岗呢，对于应聘的难度大大增加，因此选择前端是一个合适的转码方案。
2. 但这还不够，要提升自己的核心竞争力，仅采用单一技术路线是远远不够的，一定要打好组合拳，但人精力又有限，不可能在多角度都进行深度的学习，因此除了整体把控多项技术外，还要对某一门的某些方向有一定的积累。因此对于本次秋招，我选择的技术路线是全栈+图形学技术开发。
3. 个人的技术点围绕前端展开，技术栈是vue以及vue系列，后端采用的是nodejs以及衍生的express等框架，图形学围绕webgl、canvas渲染等技术展开。
4. 最后就是自己的特殊技术的积累，包括web worker掌握与应用以及前端大型存储indexDB技术的应用。因此对自己有个清晰的技术定位后，整个技术走向是进可攻退可守的，不太会受互联网寒冬的影响。

用人标准出发

• 我将从用人标准的角度出发，定位当前的招聘类型为校招，意味着开发年限相对较低，对核心技术的掌控往往尚浅，因此面试官的选拔标准更偏向于看个人的潜力，以及基础知识[八股、算法等]的掌控程度。

对于前端八股，我又将分为下面几个部分：

1.计算机网络

1. 协议及状态码
2. 网络模型[iso/osi，tcp/ip]
3. 以及每层网络的模型
4. tcp 3次握手4次挥手以及理由
5. http1.0/1.1/2.0/3.0的区别以及功能(例如问首部压缩的作用)
6. ajax的封装
7. websocket的原理以及使用
8. keep-alive等
9. https工作原理、缓存
10. 常用的攻击dos/ddos、csrf/xss以及如何解决、跨域问题等

常见考题:

1. 七层模型/五层模型以及各自对应的协议
2. tcp 握手挥手过程以及为啥tcp 握手3次，挥手4次
3. http1.0 1.1 2.0新增的规则
4. 如何防止csrf
5. 常用的状态码
6. cookie的字段有哪些，如何禁止document.cookie的访问
7. 强缓存/协商缓存的配置规则

2.操作系统

“

这个考察稍微薄弱，主要围绕进程与线程的区别、锁相关机制、通信相关机制展开

常见考题：

1. 线程与进程的主要区别
2. 信号量的作用
3. 死锁的产生以及避免方案

3.浏览器运行机制

此处的基础很重要，在后续开发中具有较为深远的影响。如首屏优化方案、渲染流程、重排/重绘、跨域通信解决方案、dom事件模型[传递和冒泡]、事件循环(区分v8与nodejs的机制)、cors…

常见考题:

1. 如何进行首屏优化[衍生出js加载顺序(defer/sync)
2. css选择器的选择优化
3. 单包多包
4. 静态资源
5. 图片压缩
6. CDN
7. 懒加载
8. 虚拟列表……]
9. 重排与重绘的执行过程
10. dom事件类型[3种]，事件冒泡的过程以及阻止方案
11. 浏览器v8和nodejs的事件循环，nodejs的nextick
12. 跨域访问的解决方案

4.javaScript/typeScript

这个是重中之重。

• 首先是对语法的熟练掌握，熟悉es5、es6等的语法编写规则[如解构赋值、箭头函数]、掌握部分原始的dom操作、
• 对于存储结构[堆/栈]、原型链、闭包、作用域、上下文、事件循环、异步、正则表达式等有一定的认知，
• 对于性能分析有一定的了解[如内存泄漏的场景以及解决方案]，熟悉封装规范[开闭原则]，深刻理解面向对象。
• 了解Map、WeakMap、Set、RegExp、XmlHttpRequest等对象，
• 熟悉Object.entries、Array.from、Array.forEach、Array.map、Array.reduce、typeof、instanceof等常用的方法，

除此之外还需要掌握现代的编程手法并了解一些开发模式，如函数式编程[函数柯里化]、订阅发布模式、观察者模式等…

常见考题：

1. 数据类型以及存储结构，创建规则以及作用域
2. 节流、防抖的编写、LRU缓存实现、数组/对象扁平化、eventBus的封装、Proxy的使用
3. 利用自调用函数等方法进行闭包；函数柯里化的编写方法
4. es5和es6的继承方案
5. call、bind、apply使用方法以及互相转换instanceof的设计、浅拷贝/深度拷贝的实现
6. 了解异步，熟悉Promise、Generator、async/await的使用，
7. 以及灵活运用这里的各种封装，如Promise.all、Paomise.rase、fetch等的封装，
8. 当然了还有比较刺激的，比如我阿里1面的时候，让我编写class底层实现Promise，这就需要了解promise的状态[pending/resolve/reject]、链式调用的构建，参考链接[https://juejin.cn/post/6844904063570542599]
9. 跨标签页的通信方案[如BroadcastChannel、localStroge添加箭头、SharedWorker]等

5.前端工程化

前端技术日新月异，前端工程化是目前最主流的开发方案。

html/css技术是基础，需要有一定的积累[熟悉编码规则，了解常用的元素，熟悉使用各种选择器(了解其中的优先级规则)，熟悉常用的布局实现方案，了解css3的动画等机制]。

在此基础上必须掌握至少1种框架[Angular/React/Vue]。

在这么多次的面试中，我发现这些公司React的使用频率比较高，较少产品使用Vue(面试小红书时他们告诉我技术栈是vue)。

由于我的技术栈是vue，这里重点谈一下。

1. 首先要熟练掌握vue的构建
2. 理解开发模式与生产模式的配置
3. 熟悉插件配置、代理配置等
4. 然后是熟悉组件化的开发
5. 熟悉组件间通信方案
6. 跨组件通信方案、前端路由、状态管理、nextick等

除此之外便是了解vue底层原理，包括生命周期、虚拟dom、diff算法、vue2与vue3的区别，以及各自的优缺点。除此之外还可以多了解一些测试库，比如Mock。

常见考题：

1. vue2与vue3区别，以及vue3采用proxy的好处
2. 组件通信方案以及跨组件通信方案
3. 什么是虚拟dom，以及vue3在diff上的优化
4. 对我来说问过最难的是tiktok一面的时候，问我单包与多包的优缺点分析，问我组件设计规范

6.跨端

考察的很少，但可能会有，更多集中在css媒体查询、第三方跨端库、路由动态加载、rem、像素比…上面

7.代码题

前端面试对算法有考察，但不算非常多，主要围绕链表操作、树遍历、图、dp、排序(尤其是快排)…。

关于手撕，其实不懂为啥网上叫手撕代码…….哈哈哈。

关于这块个人觉得可以适当积累一下(比如了解到大数运算、版本号比较、LRU缓存、订阅发布(eventBus)、Promise的各种比如all、rase等、new的实现、es5/6对象的创建、(深/浅)拷贝、节流防抖、函数柯里化。

u1s1，这些问题考察其实蛮基础滴，熟练掌握js的话，自由发挥即可欧~

常见考题：

1. 链表反转
2. 数组/json扁平化
3. 版本号比较、大数运算
4. 各种排序的复杂度、重点要深入理解快排的设计原理以及实现方案

8.计算机图形学

这个不是必要的哈，可以忽略。看到网上很多人评价说前端饱和，走下坡路，觉得互联网快不行了、大寒冬。

但本人并不那么认为，饱和的仅是web2.0罢了，web3.0正在刚刚开启，这是我们这个时代的红利。

我们不要总把局限定死在前端/框架上面，一定要学会技术转型。图形学就是一个很好的突破口，了解数据可视化，设计相关的项目会有很大很大的优势。

因为图形学项目，当时蚂蚁金服2面直接十分钟口头offer并跳过三面(hr说这是P9面)，hr面走个过程直接意向书。

常见考题:

1. svg、canvas、webgl的区别以及各自的适用领域
2. 什么是webgl、webgl的运行流程、顶点着色器与片断着色器
3. 模型格式的了解、材质、贴图、法向贴图
4. 坐标系变换过程、渲染管线的流程
5. 前向渲染/延迟渲染、分块渲染
6. 帧缓冲、离屏渲染
7. 光照类型、光照模型
8. 如何进行大模型的渲染、八叉树优化
9. 光线追踪、实时光线追踪

9.更多

除了基础八股，大厂面试官更看重个人对场景业务的解决思路。比如登陆鉴权的实现方案、如何保证安全的传输…

这些需要灵活运用手头上掌握的技术去合理设计方案。

10.关于思考

面试大厂，经常会遇到一个问题，

1. 你觉得Vue2和Vue3的区别是什么？
2. 你觉得Vue和React的区别是什么？

我认为遇到这类问题，面试官考察的未必是八股，而是思考。

“

对于第一个问题 ，常规的回答可能集中在vue2和vue3的数据劫持、然后引申到defineProperties、Proxy、然后引申到优缺点分析上。

个人认为内，除了这些基本的回答，我们还需要横向进行一些选型分析，这就是我们的思考了，为什么要选择Vue2或者Vue3，他们的适用场景是什么？Vue2升级到Vue3在代码结构上、生态上带来的价值是什么？

React和Vue也是如此。这类的思考会给我们的思维模式上有一种境界上提升，也会让自己的潜力能更大化地被面试官get到。

第三点是站在个人角度，项目经历非常重要，掌握必要的技术(如git)，拥有团队开发的经验。我的项目经历相对完整，涵盖的范围比较广，因此还是拥有一定的竞争力的。

对于大厂面试官，经常问的几个问题有：

1. 你的学习路线是什么
2. 你的未来规划是什么
3. 为什么选择前端这个方向

需要好好准备，提前思考好并规划好来应对。

最后

最后围绕面试流程进行展开话题吧。

大厂的面试流程首先是进行自我介绍，简单介绍自己学历背景后，要简单突出个人擅长的技术点，不宜冗长。然后选择自己最得意的项目进行讲解，讲解也分为几个步骤：

1. 首先是项目的背景(为啥做)，
2. 然后是项目具体实现的功能(产品介绍)，
3. 然后开始介绍主要的几个技术要点，重点解决了哪部分的问题，
4. 最后给出调试的相关分析数据/报告，进行优缺点评估，以及可以优化的点和未来的设想(画饼)。

此过程中面试官经常问的问题是:为什么要设计这个产品；你遇到了什么困难？以及怎么解决的；你的优缺点是什么？；怎么进行评估性能；后续怎么进行优化？

这些问题本质上是考察面试者的思考，以及确保项目的真实性，也就是传说中的深挖，做好这些准备是完全可以拥抱变化的。

最后就到了反问环节，我一般会选择询问:产品业务是什么、技术栈是什么、面试官对我的感觉如何……这里自由发挥罢~

反思总结

1. 虽然秋招整体很顺利，但还是在这个过程中呢了解到很多的技术上的不足，因为我的学习路线比较特殊，属于项目驱动，整个的知识框架是由一大堆琐碎的开发经验碎片拼凑的，在广度和深度上还需要进一步总结和沉淀。
2. 第二个是我的危机感，我的技术不能仅围绕着前后端技术去展开，容易螺丝钉化逐渐沦为民工，还需要融合自己的别的技术，把思维放在更深的架构设计上和产品的设计上，同时不能太自封，要多学习借鉴别人的技术，希望未来能走的更远，加油~