📍面试公司:美团
👜面试岗位:前端开发工程师(移动端方向)
🕐面试时长:约40分钟,项目交流约20分钟 + 八股提问 + 手撕算法
🔄面试轮次:第 1 轮(核心一面 / 被捞)
✨面试整体流程回顾:
这次是一场被捞的机会,能重新得到面试机会,我非常珍惜。整体节奏是:
- 面试官一上来就深入聊了项目,交流了约 20 分钟,探讨了我在项目中的角色与技术决策;
- 然后进入八股知识点环节,连续问了 7 道基础题,覆盖了 HTML、ES6、异步机制、网络协议等方面;
- 最后以一道“手撕两个有序数组合并”收尾。
虽然后半部分感觉自己答得没有上次顺,但这次换了部门,估计简历与新方向更契合,依旧希望能顺利进二面!为了更好准备下一轮,我整理并复盘了每一道题的题目、考察点、详细答案,分享如下:
✅ 面试题目逐题整理与解析:
1. HTML5 新增的组件有哪些
考察点:HTML5 新语义元素掌握
面试公司:美团
答案:
HTML5 引入了多种语义化标签,帮助构建更清晰的页面结构,包括:
<header>
、<footer>
:头部与尾部<section>
、<article>
:内容区域与独立文章<nav>
:导航栏<aside>
:侧边栏信息<main>
:页面主体内容
以及<audio>
、<video>
、<canvas>
等多媒体组件。
2. HTML 语义化的作用是什么
考察点:代码规范性、SEO、无障碍访问理解
面试公司:美团
答案:
语义化标签可以:
- 增强页面结构的可读性;
- 有利于搜索引擎优化(SEO);
- 帮助屏幕阅读器解析页面,提高无障碍访问能力;
- 增强团队协作中代码的可维护性。
3. let、var、const 的区别
考察点:变量作用域、声明机制、变量提升
面试公司:美团
答案:
var
:函数作用域,存在变量提升,容易造成变量污染。let
:块级作用域,无变量提升,不能重复声明。const
:块级作用域,声明后不可被重新赋值(对象属性仍可变)。
通常推荐使用let
和const
,避免var
带来的副作用。
4. 谈谈对事件循环的理解
考察点:JS 异步机制、宏任务/微任务理解
面试公司:美团
答案:
事件循环是 JS 的核心执行机制:
- 同步任务先执行,异步任务进入任务队列;
- 微任务(如
Promise.then
)优先于宏任务(如setTimeout
); - 每轮循环:清空微任务队列 → 执行一个宏任务 → 重复。
理解事件循环对于掌握异步编程模型至关重要。
5. WeakMap 与 Map 的区别
考察点:数据结构内存管理、弱引用机制
面试公司:美团
答案:
Map
:支持任意类型的 key,可枚举,支持遍历。WeakMap
:只能用对象作为 key,key 是弱引用,不会阻止垃圾回收;不能遍历,没有size
。
使用场景:WeakMap
常用于绑定 DOM 元素相关数据,避免内存泄漏。
6. 谈谈 Promise 的状态以及原型
考察点:异步编程模型、Promise 状态流转、原型方法
面试公司:美团
答案:
Promise 有三种状态:
pending
:初始状态;fulfilled
:成功;rejected
:失败。
状态不可逆,一经变更即定型。常用原型方法:
then
:注册成功/失败的回调;catch
:捕获错误;finally
:无论结果如何都会执行。
静态方法如 Promise.all()
、Promise.race()
、Promise.resolve()
等用于组合多个异步操作。
7. HTTP 与 HTTPS 的区别
考察点:网络协议安全基础
面试公司:美团
答案:
HTTP
是明文传输,不安全;HTTPS
是基于SSL/TLS
的加密协议,具备身份验证 + 加密 + 数据完整性校验;- 需要 CA 签发证书,首个握手采用非对称加密,后续使用对称加密提高效率;
- HTTPS 能防止中间人攻击与数据泄露,是前端开发安全保障的基础。
8. 手撕算法:两个有序数组合并
考察点:数组遍历、双指针技巧、边界处理
面试公司:美团
答案:
实现方式采用双指针,时间复杂度 O(n+m),代码如下:
function mergeSortedArrays(arr1, arr2) {
let i = 0, j = 0;
const result = [];
while (i < arr1.length && j < arr2.length) {
if (arr1[i] < arr2[j]) {
result.push(arr1[i++]);
} else {
result.push(arr2[j++]);
}
}
return result.concat(arr1.slice(i), arr2.slice(j));
}
💡总结与反思:
虽然这次表现没有上一次自我感觉那么好,但能再次被捞进核心一面,本身就是对简历方向调整的一种肯定。
这一轮让我意识到以下几点:
- 八股永远是面试的基本功,即使项目经验丰富,基础薄弱也难以打动面试官;
- 项目讲得好但不够深,还需练习从“做了什么”拓展到“为什么这么做”、“遇到什么坑”、“有什么优化”等;
- 算法环节不能轻敌,哪怕是基础题,也得写得稳、写得快、写得优雅。
🔥写在最后:
每一次面试,不论成功与否,都是一次成长的机会。这次美团一面让我看清了自己的知识短板,也坚定了继续打磨基础的决心。
未来还会有更多机会等着我去抓住,而我现在要做的,就是不辜负每一次可能通向更好的跳跃点。
愿我们都能挺过焦虑和不安,继续向前,不停迭代,一起上岸!✊
如果你也在准备前端校招或社招,希望这份面经能帮到你。需要我后续整理 JS 深度题、项目优化方向或者手撕题高频训练题,也可以留言告诉我。
我们下轮面试再见! 😊