2022-04-25 11:19 已编辑美团_前端

关注

美团面试官哥哥太温柔了，我哭死

【希望大家也都能够幸运常在😋】

（美团到店-base成都，已签Offer）

———————————面试总结———————————

面试方面：

面试官: 面试官哥哥都很好，很温柔，不是一顿八股追着你，而是抛出个实际问题，来看你对原理的思考和理解，我感觉是看你能不能把八股文结合自己的思考，然后表达出问题的解法这样子，遇到不会了解很少的问题也会一直引导你，听你对于问题的理解和表达，就很棒！

IDE感受：美团面试界面三栏布局，最左侧是出题区，中间是代码编辑区IDE，右边是视频窗口和聊天框，IDE区域能够直接编写代码并运行，比较方便编写但是没有提示（所以部分api自己需要熟悉一下），如果实在记不起来了意思表达到了也可以，毕竟大家都是自动补全，api记不住也情有可原。

面试体验：体验是很好的，面试官会跟你约定面试时间，然后如果你没按时的话，面试官哥哥会打电话提醒你一下，面试后会有调查问卷。

个人面试总结：

八股文是必不可少的，有备无患，建议如果八股文太多了背不完的话也要大致浏览一遍至少保证自己对于知识点不陌生，而不是完全不了解导致问题无法开展。
算法方面首推《剑指Offer》和《LeetCode Hot 100》基本上如果刷一遍再自己总结一下的话见到题目分析题型+总结思路+手写实现还是能够做到的。
个人理解方面建议在背八股文时候（部分原理级）也自己去思考如果自己面对这种问题时候，自己要怎么解决，为什么要这样子去解决，这样子来进一步了解这种原理的形成，而且这样子思考也能很快理解原理，在面试时候也能表达自己的想法，不怕面试官追问，并能表达自己的意见。（譬如Tcp可靠传输需要建立连接，滑动窗口进行流量控制，连续ARQ保证正确，但是造成队头阻塞，虽然二进制分帧能优化但是没法根本解决，于是http3.0里面有了基于udp的quic）。
面试准备方面建议大家不要社恐，自己笑嘻嘻的跟面试官讲什么的，就当个愉快沟通就行，问题不懂或者没听清就确认一下，千万不要讲不出来话，或者一紧张全忘记了，面试就应该发挥自己的最佳状态，而不是紧张的功亏一篑。
对于代码题这种经典问题，建议准备面试时候有单独的分类（譬如浏览器执行机制的专题），来让自己对于一类题能够理解原理，并会做题（譬如见到代码执行顺序归类为浏览器执行机制问题，然后宏任务，微任务解决掉），这样子来快速分析并解决问题。
如果实在是遇到不了解的问题怎么办？了解的少的话就尽可能的再次确认、再次回想、或者尝试往熟悉内容靠拢分析，不了解的话就建议问一下面试官这是什么，然后自己结合自己的思考或者自己的实际使用来讲解自己的认识，表面自己确实不知道但是思考了，说明自己理解力强。
项目讲解方面：结合自己所做的项目，重点突出自己的主要闪光点！（有人说没有闪光点怎么办？没有闪光点就自己去寻找一个足以说服别人的点，比如我做的都是中台的日常业务，但是我发现逻辑一样，我就采取hooks抽离相同逻辑，并且使用函数来进行拓展，保证了面向未来或者自定义的可拓展性，这样子面试官也感觉你这人做业务也是不错的）。
最佳建议：心态放平，冷静分析，认真作答，言之有物。

其他方面：

美团现在锁hc了？4.25拿到了成都的前端offer，应该解锁了或者没有完全锁。
流程慢？本次流程还是很快的，最快基本两天一二面+HR面，我是拖延了一下所以一星期左右结束的。
入职时间？确认offer时候会填写，后续能够申请修改。
春招结束了？美团网申和内推的时间应该快结束了，但是还是有机会的，我看笔试一直安排到了五月中，而且官网提示前端岗位还是简历稀缺，所以建议能冲还是可以冲一下！

———————————故事开始———————————

😭双非大三的前端懒狗，春招从三月底投了简历，然后美团内推了之后就是周末笔试链接嘛。

但是因为懒，当时也在准备八股文的复习，就没有做笔试，一直从3.19推到了4.9，问题来了，笔试时候是塞码网，不太理解多行输入的操作，而且也全是算法题，4+1算法就a了第一题，第二题30%通过，第三题20%。😢

然后就感觉是寄了，做的这么跨，结果上周五通知有面试。😢

因为感觉美团笔试那么难，面试肯定也更难，就准备不面了，直接摆烂，所以昨天晚上打游戏，今天上午一直躺宿舍床上网上冲浪。😁

结果到了十一点，有个外地电话，我以为是诈骗电话，接了，结果是面试官喊我，问我是不是忘记了还有面试😭，我哪敢说我不敢面的，我就说哦哦，然后跟好哥哥解释了一下赶紧起床面试了。😢

要是能见到好哥哥我就给他买一堆吃的。😭

———————————一面———————————

一面：

面试问题：

* 自我介绍

* 自学经历
* 自学过程
* promise基础知识和使用
* 手写个promise.all
* promise的控制并发思路
* http基础
* tcp和udp

* js基础

* 数据类型有哪些，有什么区别

* 那些数据能转为0，怎么转为0

* 数组有什么方法，那些会改变数组

* es6新增，用到了什么

* 对Linux有什么了解，常用的命令什么的【说就是前端在Linux上面使用Nginx部署时候简单的使用了Linux，常见的ls，cd，rm -rf什么的简单命令，然后问我知不知道查询进程，杀进程什么的，当然用过，但是不知道，在使用node的express写后端时候用过，但是没记住（面试官：姨妈笑）】

* 对React有了解么，写过项目没，写过demo没【了解过基础，没有写过项目，但是写过demo，react官网上面的五子棋的demo，麻雀虽小但是五脏俱全，就是没有用到hooks】

* 算法题 [力扣350-两个数组的交集](https://leetcode-cn.com/problems/intersection-of-two-arrays-ii/)【a不出来，思路有点僵硬，不知道对重复数据这么处理，卡了很久，然后尝试准备暴力记录然后比较，顺便给面试官讲了自己的思路，问他有没有建议，然后再面试官老哥的指导下，顺利a出来了】😭

* // 反问

* 技术栈是什么【React】

* 那UI框架应该是Antd了【是的】

* 那我可以在暑假实习之前正好个把月做一个React 项目了【嗯，比较简单，一个月应该是可以上手的】

* 咱们写的hooks多还是类式多【hooks多】

* 好，感觉很棒（表达兴奋）【面试官面露喜色，和我一样笑嘻嘻的】

———————————等待二面———————————

上午面试完了，感觉面试跟聊天一样，面试官老哥二话不说直接让我过了。😭

下午二面面试官哥哥已经打电话约面试了，问我下午能不能面试，当然能，但是不敢，怕一通乱问直接给我送走，于是按照之前的经验，直接拖一天，当天是周二下午，约周四上午。

晚上回去继续摆烂打游戏。😋

周三想学习，懒一下，就到了中午，下午鬼知道补课连着补了一下午，晚上还有上机，于是只能晚上上机时候拿出手柄打一会游戏。👿

转眼就到周四了，刚起床吃个饭就10点多了，run到行政楼问问老师有没有空余办公室，然后问老师最近有没有什么事情要帮忙处理的，老师讲了讲最近的事情，然后说可能日常办公室有老师在，院长刚好出差，让我去院长办公室面试。😋

不得不说院长办公室真的好，采光好，空气好，就是外面施工有点吵。

很紧张，想着突击一下，就看了个浏览器执行机制【宏任务，微任务，懂得都懂】，然后看了一下执行作用域。

———————————二面开始———————————

提前五分钟上洗手间后，就等着面试官上线打电话，等了几分钟老哥来了，很快啊，我一个在线电话就打过去了，但是貌似网不好，两分钟左右他才接通。很紧急啊，我想要不要切个网，然后我就换了校园网，再继续打回去了个电话，老哥接了，但是我依旧看不到他摄像头，也听不到声音（我设备正常），就问他能不能听见我说话，他说他能！但是我又不能听见他说话，没办法，那就再重进一下吧，又是一顿操作，最后没办法了，我说：“老哥，不行打电话吧”，然后就是手机打电话，电脑看代码做题。

结果第一道题说发布了，我一看根本没有，老哥说看一下执行顺序。

我：？？？这里就一个立即执行函数，没有什么代码

老哥：？？？你那边没有么？

我：没有，就一个立即执行函数，是空的

老哥：那我试试重新发布一下

接下来就是二面

———————————二面———————————

二面：

面试问题：

* transform和position：absolute的区别【translate 是 transform 属性的⼀个值。改变transform或opacity不会触发浏览器重新布局（reflow）或重绘（repaint），只会触发复合（compositions）。⽽改变绝对定位会触发重新布局，进⽽触发重绘和复合。transform使浏览器为元素创建⼀个 GPU 图层，但改变绝对定位会使⽤到 CPU。因此translate()更⾼效，可以缩短平滑动画的绘制时间。⽽translate改变位置时，元素依然会占据其原始空间，绝对定位就不会发⽣这种情况。】

* 浏览器执行机制问题-看代码说输出【经典输出问题了，理解好宏任务微任务后注意promise的then的进入队列时机即可，不要慌，冷静分析一下即可】

* requestAnimationFrame知道不？是宏任务还是微任务？【因为是电话说的，没听清，问是不是js控制css动画的，确认后继续回答：是异步吧任务，是微任务，因为用浏览器渲染间隙回调执行实现的（此处回答错误）（正确答案：宏任务，是没有使用回调，且又不按照代码的执行顺序执行的任务）】

* react这块了解么？【了解的不太多，但是感觉如果能去的话一个月应该可以做一个项目上手差不多了，毕竟之前写个小demo，了解类式的写法，然后vue3用的是hooks，所以上手应该也会很快】

* vue3现在你书写是用的hooks书写的是吧？【嗯，基本上是的，因为vue2的话你要是封装一些通用功能的话，就只能使用混入对吧，但是vue3就引入了组合api了，可以封装成hooks，更便于扩展和组合使用，封装更加舒服和便捷了】

* 那你用vue3写一个计数器吧，每秒自增+1【手写了一下，但是没有考虑销毁计数器，有点尴尬是没记得setIntravel怎么拼，拼错了，不过意思表达到了，毕竟使用自动补全久了】

* 这个计数器引入使用会不会有什么问题，渲染，譬如组件销毁是不是还在不断销毁，重复渲染怎么解决

【看了一下发现是没有销毁，就引入了销毁那个钩子，里面销毁了一下：你指的不断渲染是？

面试官：就是你其他外部改了之后是不是还在不断渲染？

我：哦哦，那确实，没问题，我已经理解了你要表达什么了，我改一下，看了一下发现是没有销毁，就引入了销毁那个钩子，里面销毁了一下，

面试官：嗯，现在就没有问题了，

我：嗯，销毁时候钩子函数吧计数器取消了】

* webpack的loader和plugin的区别

【我：这个了解的有点少，之前没有怎么接触过，loader是加载的吧，plugin是加插件的

面试官：这块之前接触过么

我：没有，但是大概了解了一下

面试官：字面意思吧，哈哈哈

我：不不不，loader是用npm包安装那些加载的嘛，譬如css的预处理器，plugin是加插件的，譬如进行抽象语法树然后控制代码转换的插件之类的

面试官：像loader这种流式的处理的应用还有那些？

我：这个流式处理的应用指的是流式处理的类似应用还是流式处理这种思想的其他应用？

面试官：类似应用

我：那就是webpack之前的那个rollup和glup，不过有点久远了就了解过，没有实际使用过

面试官：那你们现在用的什么打包工具？vite？

我：现在打包是vue自己脚手架的打包，之前低版本脚手架是直接的webpack.config.js配置的, 后来脚手架升级后是隐藏了, 改用vue.config.js配置的, 但是还是webpack, 只是包了一层, 后续vue3的话用vite会打包更快, vite跟webpack虽然实现上不一样, 但是使用配置上大差不差

面试官: 对, 毕竟是为了抢占用户嘛, 欸, 那vite有什么改进啊

我: vite是冷启动, 直接启动开发服务器，请求哪个模块再对该模块进行实时编译。由于现代浏览器本身就支持ES Module，会自动向依赖的Module发出请求

面试官: 使用ES Module, 那会不会产生非常多的请求啊, 同一时间非常多的请求, 因为你把他拆成了Module, 如果项目非常大, 会一时间请求十几个几十个Module文件

我: 他是访问到那个根据依赖去加载那个的

面试官: 就如果这个页面很复杂, 这个要怎么处理

我: 我想一下啊, 你是说这个如果页面很复杂, 引入了很多的模块, 同一时间加载的问题对吧

面试官: 对啊, 浏览器也有加载的限制

我: 对, 确实, 要是根源处理的话就是减少体积, 合并打包了

面试官: 除此之外呢

我: 那就并发控制, 使用promise模拟滑动窗口加标记, 并发控制并失败重试

面试官: 那这和浏览器自己控制有什么区别, tcp本来就有限制

我: 那确实是, 网页tcp有并发限制

面试官: 那怎么优化这个啊

我: 想一下啊, 咱们这个优化的目标是什么, 是太多的并发请求更快加载之类的对不对

面试官: 不仅是并发加载, 就是所有一起这样子过来的

我: 那咱们是从打包还是请求这方面解决这个问题

面试官: 打包应该解决不了这个问题

我: 那就得让后端合并批处理的接口来减少并发请求了

面试官: 但是你这是静态资源啊, 静态资源服务器处理的, 有了解过http2.0么，那http2.0可以解决这种问题么

我: 了解过，你指的是二进制分帧和多路复用么

面试官: 概念背的不错, 哈哈哈(姨妈笑)

我: 那确实能解决, 不过你要是这样子说那直接上http3.0还能无限制发

面试官: 现在有浏览器支持么

我: 浏览器支持不太了解, 大概知道微信用了一下quic

面试官: 3.0比之前的有什么好的

我: 3.0是对之前的颠覆嘛, 之前的http是基于tcp/ip的, 然后就有一系列的问题, 譬如你http2.0使用二进制分帧和多路复用解决了之前的对头阻塞问题, 但是还是没用完全解决, 是因为tcp的根源在这里, 滑动窗口和连续重传问题导致队头阻塞, 只能说是优化, 不能说是完全解决, 所以就基于udp重构, 而且udp你是知道的, 他是不可靠的, 于是要让他变得可靠, udp是传输层的, 在他之上基于他封装了应用层的quic, 可靠的udp

】

* nodeV8回收时候的两种方式, 譬如标记清除和应用回收, 标记清除后产生了一系列不连续的段, 内存不够，而这时候来了个大内存需求, 应该怎么解决【

我：嗯，要是从根本上讲的话主要是内存分配方式的不一样嘛，他肯定是要先检测一遍，看看有没有合适的空间，如果有的话就直接分配了，当然这里情况是没有，这就要回收空白空间了，譬如ABC三个段B是空白段，那就需要A往后或者C数据段往前，把B置换出来，把很多的空白段B聚集，这也是操作系统里面经典的空间回收操作

面试官: 这种空间调换，咱们V8的事件循环机制是什么

我：事件循环机制啊，那这个应该是I/O阻塞，node虽然是单线程但是采用事件循环机制来解决这种I/O阻塞，当然，譬如读文件有同步和异步的方法，使用异步就等待读取完再回调，就不阻塞，使用同步方法当然就会阻塞

面试官：那这种情况的话，我们js有很多同步的执行，这时候被阻塞了，我们会怎么去优化？

我：你指的是上一步同步阻塞太久导致下一步同步无法执行对不对

面试官：不是，就是如果我们回收的内存非常大，回收这个同步阻塞过程，我们怎么去做优化，V8怎么去做优化

我：V8，。。V8怎么优化的，啊这，没有了解过，我想想如果是我怎么处理啊，emmmm，在解析代码时候对I/O进行标记吧，如果后面没用到就先将他挂起来，用得到的话没办法只能等

面试官：他是个同步怎么挂，同步这个你一旦挂了，他就挂了啊，要是没执行完，那就没了，还要重新执行

我：确实啊，这不兴挂，我想想

面试官：vue3.0里面我现在不知道有没有这个概念

我：什么概念？给我讲一下，我看看我有没有了解过

面试官：（一个单词，不认识）增片，就是双列的数据结构，每执行一个分片时候就在什么周期里面，然后根据diff时候虚拟dom太多了之类的时间太长，所以需要分片diff（blblblblb这样子给我讲解了一下）

我：嗯嗯，能理解，确实是需要这样子去做，之前没有接触过这个概念

】

* 剑指offer 42 连续子数组的最大和（https://www.nowcoder.com/practice/459bd355da1549fa8a49e350bf3df484?tpId=13&tqId=23259&ru=/exam/oj/ta&qru=/ta/coding-interviews/question-ranking&sourceUrl=%2Fexam%2Foj%2Fta%3Fpage%3D1%26tpId%3D13%26type%3D13）【经典dp算法的基础使用，四行代码搞定，面试官看了一下逻辑，我做完了顺带说了一下如果要求范围的话就需要标记索引，这样子来求范围】

* 面试官：之前是在快手实习是吧，做什么的，做了什么【讲了十几分钟的快手往事，总部，我的分职场，我睡睡眠舱，逛罗森超市，部门研发，我参与的项目，我的贡献和负责，我一系列的对于代码逻辑的封装操作（面试官很感兴趣，说我很会自夸，每一句说自己棒的，但是处处这样子表示，然后我就说自己也只是普通实习生干的普通的活而已，只是有时候这样子来更合理的组织代码blblblbl），我改的bug，我打工的生活之类的，面试官姨母笑，哈哈哈哈】

* // 反问

* 部门是做什么的【到店的研发blbllbbl】

* 我可以准备React项目的上手了么（暗示(✪ω✪)）【都是要准备的两条腿走路blblblbl，看后续hr的情况（暗示成功！）】

* 生活愉快老哥，再见【好】

———————————HR面———————————

不知道还有没有hc了，毕竟是base成都，不过也没怎么抱希望，但是被团团强捞（团团，我的团团0(｀・ω・´)）。

周四面的二面，周五疯狂看进度，但是没有变，还是二面，周六开始摆烂打游戏。

周日上午接到北京电话，是HR面吧可能。

HR面就不展开细说了，不过HR姐姐声音很好听，问了很多问题，譬如

* 家里情况

* 自己学习情况
* 父母工作，养老，定居情况

* 自身情况