史上最全前端面经,收藏这一篇就够了

赶在上海封控前换了工作，最近有空给大家整理了下自己的面试心得，也是一个自我学习和反省的过程。今年的大环境不太好（似乎每年都是这么说），但这次面试和以往自己确实感受到了很大的区别，各大公司更加注重算法和http基础了。分大厂、独角兽、互联网+三类型的公司，分别给大家介绍自己的面试经历，总有一款适合你。

一、大厂篇

都是线上视频面试，用的都他们公司自己研发的面试平台。面试官很客气，面试过程也是循序渐进的，问到你不擅长的领域也是点到即止，不会让你尴尬。本人只面到了第三轮，后来就没有后续了。第一轮主要是js基础、以及手写代码题。第二轮主要是框架源码、以及算法题。第三轮主要是项目了。部分题目供大家查漏补缺

1、typeof进行类型检测的原理是什么

2、浏览器缓存的位置及其区别

3、CSRF、XSS攻击及防御方法

4、为什么vue中引用一个组件需要注册，而react不用

5、vue模板解析的过程

6、axios可以通过new Axios实列的形式使用，原理是什么？

7、手写节流防抖函数

8、手写快速排序的实现

9、实现简单的emitter

10、http1.1和http2.0的区别

11、diff算法比较的过程（深度优先、同层比较、首尾假猜）

12、async\awiat原理

13、手写pluging\loader

14、webpack打包过程

基础算法题：找出字符串中第一个只出现一次的字符。

用循环实现后会追问时间复杂度、空间复杂度更优的解决方案

算法题大多数都是leetcode上的，我就不一一列举了。主要涉及到二叉树、链表、哈希表、栈和队列等数据结构，以及排序、查找、递归循环、分治、动态规划、回溯等算法。在leetcode上刷题之前，建议大家还是先了解下基本的概念。

二、独角兽篇

一二轮都是线上视频面试，主要用的是腾讯视频会议。

一般是两轮线上技术面试，第三轮去公司与项目经理和hr聊。面试的内容和大厂基本差不多，算法方面会比大厂简单一些，但框架原理方面会问的比较多一些。

1、vue2和vue3的区别

2、ts中type、interface的区别

3、优化seo的多种方式

4、服务端渲染方面的内容（服务端、客户端生命周期的调用）（脱水、注水）

5、常见的js类型错误

6、npm发包流程

7、node事件机制、进程等内容

8、webpack热更新原理，与5的区别

9、线上项目错误收集机制的实现

10、单元测试

11、file-loader、url-loader的区别

12、http和https的区别

13、webpack打包vue项目时做了哪些事情，分template、script、style三个部分介绍下

14、介绍下常用的设计模式，以及应用场景

15、vue-cli帮我们做了哪些工作，是否可以自己实现一个脚手架

16、虚拟dom什么场景下减少的dom操作

17、微前端、低代码等

18、实现简单的promise

面试过程也是循序渐进的，由易到难。问题都是你会的，或者是了解过的，但对理解深度要求比较高。平时如果不注重学习积累、仅凭工作中用到的那些技术是无法回答好这些问题的。

三、互联网+篇

主要是电话初试+公司面试，一般都是一轮过。这些公司问到的内容和我们平时开发中用到的技术就比较接近了，侧重点在js基础以及框架的使用。也会有一些原理方面的问题，用于拉开面试者的差距，方便定职级和薪水。只要你前面基础问题都回答出来了，一般都能走到hr谈薪水的环节。

1、父子组件生命周期执行的顺序

2、跨域、同源策略

3、es6数组操作的方法

4、数组遍历的方法

5、forEach、map的区别

6、map是否可以修改原数组

7、数组去重的多种方法

8、数组平铺的多种方法

9、自己实现一个flat()方法

10、vue自定义指定

11、vue组件之间通行的多种方式

12、小程序开发及发布过程，使用过那些框架（列如：uniapp）

13、hybrid与 原生通信的方式

14、vue2和vue3样式穿透的区别

15、vue响应式的原理

16、ui组件发npm包，如何实现按需加载

17、json数据类型

18、http响应头有哪些内容

19、es6的set 、map类型（做算法题经常用到）

20、keep-alive中组件生命周期触发的过程，第一次进入、第二次进入

21、环境变量的注入

22、为什么vue中可以直接使用this

23、表单组件的实现、from表单触发校验的原理

24、this.nextTick()的原理

这些公司的面试官水平就参差不齐了，有些人面的过程中确实会让人觉得不舒服，给人一种居高临下的感觉。还有一些就是你能感觉到他是在网上找的题目，一道道问你，你回答出来了他也不深入的问。反正林子大了什么鸟都有，作为面试者的我们来说一定要戒骄戒躁。问到不会的，别自我是否定。问到过于简单的，也别不屑一顾。用最近网上很流行的一句话来说就是“他横由他横，明月照大江”

四、总结

涉及到的前端知识大概有这些：

1. Js基础

2. 框架基础及原理

3. http

4. 打包工具webpack、vite等

5. es6

6. 浏览器相关知识

7. 数据结构及算法

8. node.js

9. hybrid、小程序等

写在最后：

面试是一个双向选择的过程，我们面试的时候不要把自己当成一个被挑选的弱势者。前端知识杂且多，有时面试结果不理想，不要怀疑自己。只是在某个方面自己还有欠缺，之后补上就可以了。我们不是在祈求别人给我们一份工作，我们只是在找寻一个适合我们的公司。不妄自菲薄更不骄傲自负，整理好心态，你一定能找到适合自己的公司！！！

五一假期每晚20:00会在知乎上做“前端面经”的分享直播，感兴趣的可以关注下。也可以关注公众号，找到我的私人微信，把你想了解的问题提前发给我