时隔一年半我一个卑微的前端菜鸡又来写面经了

　　高德 滴滴 美团 网易 快手 腾讯 金山 360 百度 知乎 微软等大厂面试经验

　　一年半以前，写了个万字前端面经，最终去了字节混饭吃，因为一些业务调整的原因，我又跑路了，没写一面二面都是一轮挂的或者后面我不想面了的，附带部门的是挂了或者我拒了之后又面了另外的部门，按照一面开始时间先后排序，还有很多优秀的公司我面了但是忘记录音，比如momenta、完美世界、掌阅等等。现已完成更新，全文共计一万三千字，

　　本次面试持续了整整四周，密度非常大，平均每天四家，身心俱疲，如果不是时间紧迫建议不要把面试安排得这么密集

　　算法和数据结构不是短时间就能练成的，不过好在前端不会有太难的算法题，都是基本的动态规划，回溯，数组遍历，链表，二叉树的问题，如果自己算法实在不太行，找工作提前一两个月把力扣上比较经典的题刷一刷，遇到题最起码不至于没思路，各种排序的原理还是要看看的，很容易被问到，而且一旦答不上来很减分

　　不管你写Vue的还是React的（如果你写ng当我没说），很容易被问到两者区别，建议从多个角度去聊，比如框架特性、生态、开发体验、社区评价、性能、源码等多个角度聊

　　有亮点的项目最好多准备几个，最好是不同类型的，比如业务的、偏中后端的、组件库的、工程化的和新兴技术的，根据自己擅长的内容最起码准备两三个，有的面试官就是想看你都做过哪些有难度的事情，一招鲜这时候就不好用了

　　对不同的角色的面试官问的问题，要在不同的角度回答，比如同样问你有没有处理过兼容性问题，对前面的面试官，就可以回答遇到过的不兼容的场景和解决细节，遇到后面leader的面试就可以更多地从如何高效验证排查兼容性问题这个角度回答，注意场景

　　最后一般面试官都会给提问题的时间，我个人一般是问业务内容、技术栈、团队规模或者未来业务和技术上发展方向，到后面的面试官我会问一下这位面试官在这个团队中的角色，根据他的角色结合他对上面几个问题的表述可以初步判断出这个团队是边缘的，还是核心的，还是单纯是个画大饼的

　　整体面下来，面试体验最好的是微软，谦卑，有礼貌，感觉微软面试官是有一整套面试话术的，比如

　　“接下来我会问你一些业务相关问题，请在不违反当前公司原则的情况下回答，如果我的问题你不方便回答可以直接告诉我”

　　我答的题，还有我描述的项目，面试官一般都会先给予肯定答复，如果有问题再做进一步的提问

　　中途有一轮，面试官的问题我理解错了，实现了另一个东西，面试官第一反应是自己没有表述清楚，而且说我理解的这个方向的代码实现得很好

　　后面英文面试时，我英语很差，面试官说了一大段英语我基本没听明白，面试官问我是不是自己说太快了

　　esmodule 介绍一下，它和 commonjs 的区别，主要的优势是什么

　　介绍一下 vite 的原理，它会去编译你的代码吗，vite 引用 commonjs 的包的时候怎么处理

　　git 对象上的操作有了解过吗？git reset、rebase 这些操作用过吗 ？

　　看你之前跳的都比较频繁，每段都没超过两年，京东有个二五原则，这个问题你怎么看

　　Vue 组件之间的通信方式都有哪些，用过 eventbus 么，eventbus 的思想是什么

　　Vue 生命周期有哪些，都是做什么的，updated 什么情况下会触发，beforeCreate 的时候能拿到 Vue 实例么，组件销毁的时候调用的是哪个 API

　　Vue2 的数据响应式有两个缺陷，你知道是哪两个缺陷么，为什么会有这样的缺陷，如何解决

　　Vue 如何实现的数组的监听，为什么 Vue 没有对数组下标修改做劫持

　　写个动画，一个盒子，开始时缩放是 0，50%时是 1，100%时是 0，开始结束都是慢速，持续 2 秒，延迟 2 秒，结束后固定在结束的效果

　　这是我面的比较离谱的一个，问各种API，没什么实际营养，说实话挺无聊的，面试体验也一般

　　你们开发的 h5 项目依赖的安卓和苹果的 webview 的内核分别都是什么

　　Lottie 动画上做过哪些优化，有考虑在低端机上用 CSS 动画做么

　　如果让你做一个动画，一个地球本身在自转，外面有个飞机围着它转，飞机的螺旋桨自己也在转，有哪些需要考虑的点

　　webpack 迁移 Vite 遇到过哪些问题，之前 webpack 慢是为什么，有过优化么

　　如果实现一个三栏布局，需要三栏占同样的宽度，放多个元素时会自动换行，有哪些做法

　　移动端适配是用 rem 还是 vw？分别的原理是什么？你们用什么方案？

　　p 成功的会如何走，如果 p 失败了进入 b 之后，b 中又失败了是否会继续执行后面的 c 或 d

　　下面这个 class 的四个属性分别属于这个 class 的什么，fn 和 f 有什么区别

　　keep-alive 的原理是什么，如果不用它的话怎么自己实现类似的效果

　　如果需要你实现一个全文翻译功能，富文本的标签部分你是如何处理的，翻译之后数据如何回填

　　type B = LeftTrimA; // Hello world!

　　如果需要你实现一个弹幕的组件，你需要如何设计这个组件的 props 和 state，内部如何实现，有哪些地方可以优化

　　二面前面聊了聊项目，最后一直在给我将部门未来的发展趋势，说了很久，说实话我听得有点困了，然后不知道为啥给我挂了

　　SSR 和 CSR 的区别，Nuxt 这类的 SSR 方案和直接渲染 ejs 这类方案有什么本质的区别

　　Vue 的单文件开发模式，这个解析 vue-loader 是如何实现的。

　　的部分会如何处理，由于 babel-loader 是只能针对 js 类型的文件进行转化，那.vue 文件中的 标签是如何被 babel-loader 读取的。

　　vue scoped 是怎么实现的，dom 上的哈希是如何和 style 中的哈希对应起来的，又是如何保证每次生成的哈希不变的

　　Vue 调用 render 函数的时机是在什么时机被触发的，后续状态变更导致 render 又是谁触发的

　　Vue 和 React 在数据更新上的差异，Vue 这种数据劫持的方式会不会带来额外的问题，Vue3 在这些问题上有优化么

　　异步更新 DOM 这个操作，Vue 和 React 都是如何实现的，Vue 的异步处理还有其他方式可以做么，除了 MessageChannel 还有其他和他用法类似的 API 么

　　用什么方式发请求，axios 是个同构的工具，它是如何实现区分 Node 和浏览器环境的

　　axios 内部如何把 xhr 的 callback 转换为 promise 的，如何处理请求异常的

　　Vue2 和 3 的区别，依赖收集和派发更新都是如何做的，vue 是如何保证父组件重新渲染不导致子级重新渲染的

　　Vite 依赖与预构建是把所有的用到的依赖都合并到一起还是每个都是单独的包，一个包安装了多个版本问题如何处理？

　　node 的进程管理了解过么？多进程都有哪些方案？ 4.1 worker 挂了如何能监测到？ 4.2 IPC 通信是什么？ 4.3 如果用 cluster 启动多进程后，子进程是多个端口还是一个端口？ 4.4 一个 worker 是一个进程吗？它有独立的 pid 么？ 5.5 进程之间数据通信如何做

　　node 内存泄露是如何监控的？原理是什么？内存是监控进程的还是监控 docker 的？

　　http2 都有哪些应用，多路复用和 1.1 版本 keep-alive 有什么区别和联系，如果 http1.1 服务端需要按顺序处理请求，那为什么有的时候在一个页面里看图片，有时下面的图片会先出来，http pipeline 有了解吗，http 流传输有了解吗

　　前端的工程化都做了哪些事情？git CI/CD 都做了哪些事？比如 lint，安全检查，圈复杂度都有关注吗？lint 的规则是你们业务自己定制的吗？组件测试和自动化测试有做吗？上线的流水线有配过吗？小流量上线是如何做测试的？

　　Taro 多平台的兼容是怎样做的，Taro 是怎么把 react 代码编译成运行时，运行时是什么样的代码，又是如何让它在原生小程序的 DSL 中执行的

　　前端监控报警是怎么做的，都有哪些监控指标，报警的策略是怎样的，关注哪些指标和维度，白屏如何监控

　　这个真的是有点。。。难，很多完全是我知识盲区，尤其node的部分和Taro的部分，挂得服气

　　你们的 RPC 用的哪个框架，grpc 和 thrift 的区别有了解么，protobuf 有了解吗

　　webpack 迁移 Vite 有遇到什么问题，snowpack 有了解过么，它和 vite 有什么区别

　　一个页面的性能指标都有哪些，你是如何做监控的，如何监控 node 服务的性能监控

　　实现一个二叉树中序遍历的迭代器，时间复杂度最好是多少，最差是多少，空间复杂度是多少

　　/*** 现在我们有一个便利店的实例对象，目标是需要增加对商品价格的监听，当商品价格发生变化时，触发对应的事件。* 1、小明关注苹果价格变化* 2、小刚关注橙子价格变化* 3、当价格变化时，自动触发对应的事件*/

　　/*** 应该补充怎样的逻辑能够使得我们能够监听shop中的属性值变化呢？* 提示：vue中双向绑定是怎么实现的呢？* vue2.0或vue3.0的实现方式都是可以的*/

　　举例一下 Map 和 object 的区别，如果需要一个字典的需求，都是 key: value 的形式，那应该怎么选择这两个呢

　　二分查找的时间复杂度是多少，简要描述一下过程，O(logN)是怎么算出来的，TopK 的时间复杂度是多少，快排的时间复杂度是多少

　　ES5 的继承都有哪几种，主要介绍一下组合寄生，下面这个的输出是什么，this 指向谁

　　这一轮面试面了一个半小时，真的就是在一个功能上加来加去，其实想想还是挺考验代码健壮度的

　　如果希望DOM中的一个值和js中的变量双向绑定，使用原生js可以怎么做，React和Vue分别又都是怎么做的

　　proxy和defineProperty的区别是什么，各自的优势和缺点是什么

　　浏览器发请求和node发请求都有什么区别，浏览器都为发请求做了哪些默认行为

　　为什么Vite比webpack快很多，ESM和commonJS的区别是什么，为什么ESM加载会更快，如何理解ESM的静态

　　js的数据类型都有哪些，有什么区别，为什么基本数据类型存到栈但是引用数据类型存到堆

　　Promise的then的链式调用，返回的一个新的promise的状态是什么

　　esmodule和commonjs区别是什么，还接触过其他的模块化方案么

　　浏览器都有过哪些了解，内核都有哪些，chrome浏览器开启一个页签时开启了多少个进程，对应开启了哪些线程

　　强缓存和协商缓存谁的优先级谁高，区别是什么，强缓存和服务器有通讯么，没有通讯的话有状态码么，状态码是谁返回的，缓存是存到了哪里

　　http都有哪些版本，1.1有什么不好的地方么，队头阻塞是什么引起的，2.0有没有完全解决了队头阻塞问题

　　SSR和CSR的区别是什么，分别的适用场景是什么，什么叫同构，除了SSR还有什么方案可以解决首屏渲染问题

　　面试官迟到五分钟没有任何道歉，让我开摄像头自己不开，面试全程一直在pua，问我有挑战的项目，我一句话得被打断三次，极其没有礼貌。以下是面试官原话

　　// 多说一下，这个其实考察的是画页面的基本能力和细节，比如假如使用fixed布局，滚动条会是全屏的

　　// 但是如果使用absolute，限制屏幕高度100%，中间局部滚动就可以把滚动条限制到中间部分，甚至可以隐藏滚动条

　　// 面试考画页面的话，一定要多注意这类细节，还有比如BEM命名、1px边框等问题是否有意识，这些都要考虑

　　Vue的filter原理有了解吗，如果需要你实现一个filter，可以实现把一个字符串首字母大写的功能，你要如何做（最开始问原理，导致我后面理解错了，我以为是让我实现一下Vue的filter功能了，然而人家其实要的是abc = Abc的一个方法，但是面试官对我的实现持肯定态度）

　　用css实现一个Tooltip：界面上有一个Button，鼠标hover上去后会在Button上方显示一个tooltip，这个tooltip有圆角，下方有一个小三角形

　　合并多个有序数组（这题里我解答完之后自认为时间复杂度是O(n2)，循环中用到了shift这个方法，面试官问我这个的时间复杂度是多少，我说是O(n)，面试官说有什么办法可以解决这个么，我说可以基于原有的方式倒着循环，这样就可以用pop代替shift了，面试官问我为什么pop时间复杂度是O(1)，我说不知道，面试官让我有时间可以去了解一下均摊算法）

　　bridge的原理有了解么，有遇到过什么问题么，在一些没有bridge的场景里有没有做过特殊处理

　　写一个React Hooks，用来倒计时，传入时间，返回start、pause、restart、isRunning

　　实现一个方法，传入一个url的数组和一个数字，对url进行请求，并根据数字限制最大请求数

作者：admin

抖音快手 站点 QQ交谈