美团｜前端开发实习生 | 北京 | 2021 一二三 + HR 面面经，许愿 offer
折本咲焰
7592
2021.04.10
2024.02.17
发布于 未知归属地
美团面经前端前端面经大厂面经求职面试面试经验

背景

双非一本，日语+软件工程，大三，前端开发 实习生，去年7月开始准备的实习
7 月 ~ 8 月 hc，9 月到 3 月 js，3 月底 vue 框架。

项目：导航 & 个人博客 & 后台管理系统，和一个后端同学 3 月初合作的一个原生 JS 项目，用了一些ES6的技术模板字符串、 箭头函数、 Promise，还有一些事件委托、 Ajax 等。
这个项目已经搭建在腾讯云上了，可以正常访问，出于安全考虑这里就不放地址了。

部门：美团 金融支付部门，在美团内大概类似于蚂蚁相对于阿里的定位。

4 月 13 号更新：
今天下午 OC 了！感谢所有帮助过我的人。

笔试

时间比较远，3 月 20 号的笔试，是一些常见的算法题，题目记不清了，比较场景化，需要一些抽象分析的能力。

一面 3.24 视频面试 | 60 分钟

  1. 自我介绍

  2. 项目是用原生写的？

  3. 项目做了多久了？

  4. 这是一个项目的三个模块是吗？

  5. 简单讲讲你对箭头函数的理解

  6. 箭头函数没有自己的 this，这句话对吗？

  7. 箭头函数的 arguments 和 super 和平常写的函数表达式有什么区别？

  8. 代码题：输出什么？

    var Foo = () => {
	console.log(1);
}
var foo = new Foo();
console.log(foo);

    答案：Uncaught TypeError: Foo is not a constructor

    这道题本质是箭头函数不能被new调用。

  9. 大概多久能来实习，可以实习多久？

  10. 谈一谈你对原型链的理解。

  11. 原型链有两个概念，prototype 和 __proto__ 他们有什么区别？

  12. 为什么要选择使用原生 JS ？

  13. 讲一讲基于你学到的，vue 的内容？

  14. 谈谈你对事件委托的理解。

  15. 如何阻止事件的默认行为？

  16. 你了解哪些数据结构？

  17. 你知道我们如何判断一个链表中存在环吗？

  18. 代码题：输入一个数组，去掉数组中所有的偶数

    面试官建议：直接上手ES6的写法

  19. 屏幕适配、移动端适配有几种办法？

  20. 听说过 rem 吗？简单介绍一下原理？

  21. 一个元素的宽是 1rem，它的计算结果是多宽？

  22. 适配屏幕的时候，body 的font-size应该设置为多少？

  23. iPhone 12 max 和 iPhone 5s ，屏幕差异较大，你如何去确定 font-size 大小？

  24. 这个属性值是哪里设置的？在 header 中的属性。

  25. 你对 MVC 和 MVVM 如何理解？

  26. 简单地说一下 flex 布局的几个属性？

  27. 你的意向城市？

  28. 有没有计划考研？

反问：

  1. 我个人能力哪些方面还需要补足？

二面 3.29 视频面试 | 40 分钟

  1. 距离上一次面试有好几天了，还记得吗？

    记得，然后讲了自己收获颇多。

  2. 那你总结了哪些？

    1. 箭头函数不能使用 new
    2. 拾起来了数组 ES6 的一些方法

  3. 你的简历上写的你是日语 + 软件工程专业，是双学历吗？

  4. 你是什么时候开始接触前端的呢？为什么要接触前端？

  5. 你觉得前端这个方向，有哪些职责是前端应该负责的？

    用户看到的 和 交互的 还有和后端的合作。

  6. 前端方面你学了哪些？

  7. 你是哪儿人？口音跟我一个同事很像（笑）

  8. 从去年学到现在，最让你兴奋的点是什么？

  9. 在做这个自己的项目过程当中，你遇到的最大的技术上的问题是什么？

  10. 简单聊一下 Promise，你知道它有几种状态吗？

  11. p.then().catch().then() catch 执行了以后，catch() 后的 then 还会执行吗？

    我推测不会，catch报错以后，就无法再被改变了。

  12. 什么叫做事件委托？

  13. 举例了我博客页面的例子，问我如何设计我博客这种四块的布局？

    在这里插入图片描述

    1. 使用百分比布局（流式）
    2. flex 比例布局
    3. bootstrap
    4. grid

  14. 五种颜色的同心圆，你如何实现？

    首先居中，然后模拟圆。

    放五个盒子，设置 border-radius:50%，使用 index 层级调整层级

    用 border 去做一层环，可以省两个盒子。

  15. 用 border 的话，你要用几个盒子？

    3 个。

  16. 怎么只用一个盒子去实现 5 个同心圆？

    提示：css 中一个:和两个::的区别是什么？

    使用伪元素替换两个盒子。

  17. 一个盒子最多可以实现多少个同心圆？

    使用 box-shadow 可以做无数个，可以研究一下这个方向。

  18. 五个浮动盒子，按 12345 排列，如何把它们调转顺序？

    1. 手动修改 HTML
    2. 使用 flex 中的 justify-content: row-reservse
    3. 使用 js 修改

  19. 提示一下，CSS3 中有个 translate，有用过吗？

    这里没有想出来，面试过后我仔细思考了一下，思路可能是这样的：

    以 3 号盒子中间为轴，然后按平行于屏幕且垂直于五个浮动盒子这条直线的轴旋转 5 个盒子，再对每个盒子单独镜像翻转。

    大概是下图这种感觉。

    在这里插入图片描述

  20. 你已经学了十天的 vue 了对吧？你觉得它和原生 JS 最大的不一样和最让你爽的点在哪里？

    答了数据双向绑定，不用对DOM频繁操作了。

  21. 有没有什么东西让你觉得不爽的？

    当时没有想到，就讲了整个选项钩子这些，感觉比较多余，自己学习的时候还是没有去实际感受吧。

    事后想想觉得初学者的角度看得不够深，只能再用一用才知道。

  22. 有看到生命周期的那部分吗？

  23. 如果说你要学 vue 这个框架，你的学习路径是什么？

    API → 初始化 → 模板 → 脚手架cli → 路由router → 状态管理 vuex → 做几个项目实践 → 了解原理 → 造轮子

  24. 你现在都看了哪些有关 vue 原理的东西？

    大概说了v-if 和 v-show ，MVVM和数据双向绑定原理

  25. 你有没有自己的职业规划？或者学习计划？

  26. 你现在还是大三对吧？是找实习吗？（这里是想问实习时间）

  27. 如果是北京的话你会来吗？

反问环节

  1. 您对“前端已经停滞了 3 年没有发展了”这个观点怎么看？

    拿 java 举例子，java 有多少年没发展了？

    然后举例子：

    语言层面的东西：TypeScript 和 WebAssembly

    框架层面：React-native Flutter

    场景：微服务

    前端有新东西，技术要有落脚点有场景。

  2. 我看到美团有在公众号上发布 “Flutter”的一些平台解决方案。

    Flutter 这个东西刚出来的时候我们就有在跟进，之前踩过很多坑，技术已经成熟了，分享经验出来给大家用。

三面 3.31 视频面试 | 75 分钟

  1. 介绍一下自己

  2. 算法题：容器盛水问题，同力扣42题接雨水。

    给了大概 30 分钟，面试中没有写出来，只是按着自己错误的思路基本完成了算法

  3. 大概是什么时候开始做的web前端开发？

  4. 为什么会选择 web 前端呢？

  5. 你是哪一年的？

  6. 讲一下网络传输的整个过程？都做了哪些事？基于某一个浏览器吧

  7. 在浏览器中键入 URL，它怎么找到目标服务器的IP地址的呢？

    这里是问 DNS 的解析过程吗？

  8. www.meituan.com DNS 服务器去解析这个IP，如何去解析呢？

    主机→本地域名服务器（递归查询）→根域名服务器（迭代查询）

  9. 知道IP地址以后，还需要什么样的信息才能锁定服务器？

    当场回答了 MAC 地址，但是实际上不需要，这个问题我下来也没搞太明白。有想法的同学可以在评论里指出。

  10. http和https 有什么不同呢？

  11. 它使用的是什么加密算法了解过吗？

  12. 对称加密和非对称加密的区别是什么？

    这里答得不好，见这个文章有讲对称加密和非对称加密（一）初步理解

  13. 你做这几个项目，最有成就感 的事情是啥？

    静态页面动起来，可以实际去发请求，去操作数据库，这是以前项目里都没有的。

    后续：回答新增内容：我现在把网站部署到服务器上了，可以在外网上访问了。可以去给别人展示。

  14. 问了我奖项的一些详情。

  15. 有没有刻意去了解或者接触过一些前端行业里的技术呢？你觉得感兴趣的特别有意思的。

    提到了 ES6 的几个点，提到了闭包。

  16. 可以讲一下闭包是怎么实现的吗？

    讲了工作原理，应用、优缺点。

  17. 有接触过小程序的开发吗？

    提到了昨天稍微帮室友写了一些小程序的样式，大概了解到小程序类似于框架的设计理念，但是有自己的生态系统

  18. 那你现在有在用什么框架吗？

    提到了 vue。

  19. [特色题] 平时坐车，车上有一个安全带，这个安全带可以拉出来，如果车发生碰撞，这个车速会非常快，安全带就不会被拉出来了，反而会固定，来保证我们的安全，如果你是设计师，你怎么去设计出这样一个效果？

    迄今为止我所有面试中没有遇到过这类问题，不知道应该回答的重点在哪里。我答出了：如果瞬间加速度大于某一个值，安全带就锁死一段时间，等加速度降下来再回复拉伸弹性。面试官问我怎么实现，我回答应该是要依赖于某种工程结构。然后拿了书包那个举例。

    下来网上找了个知乎的回答：

    安全带这一看似很简单的机构，为什么能在关键时刻挽救人的生命？科学原理在哪？

  20. 是哪里人？

  21. 未来打算去哪里发展呢？

  22. 接下来的职业规划？

  23. 介绍一下从小到大最有成就感的一件事？

    没有被问到过这种问题，也没提前想好这个问题该怎么回答。
    这个题我本来稳拿分的，当时硬是没想起来呜呜呜。

    大一的时候去过三个月美国，拿过美企 offer，还策划了一手和女朋友的旅游，又省钱又省时间，最终挺圆满的。

反问环节

  1. 对今天的表现做一个评价

    1. 基础再夯实一下。
    2. 不用太紧张，表达的时候不是很流畅。

  2. 您也是做前端的，您对前端未来的发展有什么看法？

    大前端方向。鸿蒙，windowsphone，刚开始比较割裂，现在能明显感觉到往统一的方向走。

    移动端。设备不断便携的情况下，前端又是什么？

    物联网。家居设备，人机交互界面。

这次面试能不能过就看同龄人发挥了，我感觉是五五开....到今天 4.5 还没消息，祈祷一波能过吧..

hr 面 4.7 视频面试 | 30 分钟

上课的时候接到的电话，跑到教室外，人家告诉我前三面技术面过了，想和我约一下hr面时间，回来的时候都有点压抑不住激动的心情。

hr 面忘了录屏，基本上就是问了一些项目之类的问题，大概考察个人解决问题的能力。

hr 说最快这周出结果，下周拿 offer，现在还没得消息，许愿一波上岸吧！！！

感受

美团的面试官还是很和蔼的，基本上都是笑呵呵的，让人压力没那么大。
腾讯也面过好几次，但是腾讯大部分面试官给人感觉很严肃...emmmm 腾讯这次又过了一面，希望也可以过吧，我也挺想去深圳的。

评论 (9)