【前端面经】美团-核心本地商业-业务研发平台（暑期）

一面（2025/02/13）1. 自我介绍2. 你如何学习前端的3. 为什么没有继续深入大数据相关行业4. 项目介绍    1. 项目功能    2. 如何处理学生考试时提交结果的高并发的问题    3. 为何选择 Pinia 而不是更加主流的 Vuex，出于什么考虑    4. 项目打包过程，产物是什么样的，浏览器能运行什么文件，能运行 ts 文件吗，为什么只有一个 index.html 却能显示不同页面，Vue 中的 template 代码是如何在浏览器中被看到的（这里一开始没有回答上来，所以在引导我）（单页应用 SPA）5. 工程化    1. Vite 打包过程    2. Webpack 与 Vite 的区别    3. Webpack 中的 loader 是做什么的    4. es6 转 es5 是怎么实现的，听说过 Babel 吗    5. npm、pnpm、yarn 的区别，lock 文件是做什么的6. Vue    1. 组合式 API 与选项式 API    2. Vue3 与 Vue2 的区别    3. 组件通信方式7. CSS    1. 有哪些布局，讲一讲 Flex 布局，常用属性    2. 定位方式    3. 选择器优先级，important 的优先级是多少8. JS    1. 实现异步的方式（回调、Promise、async/await）    2. Promise 的 API，Promise 的参数是什么    3. 事件循环，JS 引擎为什么是单线程    4. 浏览器缓存（强缓存、协商缓存）9. Git    1. 常用命令    2. rebase 与 merge 的区别10. Linux 常用命令11. 数据结构与算法    1. 数组和链表    2. 有哪些排序算法，冒泡排序与快速排序的时间复杂度    3. 图的表示方式    4. DFS 和 BFS，层序遍历属于哪个12. 反问：什么是大前端如何学习前端的回答没有让面试官满意；项目细节不太了解，没有去尝试理解更深层次的部分；对前端打包细节了解不多；基础知识仍然需要再完善提高。美团的面试官让我对面试有了新的认知，跟京东的面试体验差距好大。二面（2025/02/20）1. 面试官自我介绍，自我介绍2. 能实习多久，什么时候能来3. 你熟悉的技术栈4. 盒模型5. 居中方式6. 事件循环7. 防抖和节流8. HTTP 状态码9. OSI 七层模型10. UDP 和 TCP，TCP 为什么更可靠11. GET 和 POST，POST 为啥要两次请求12. JS 与 TS 的区别13. TS 类型14. v-model 原理15. computed 和 watch 的区别与使用场景16. nextTick 使用场景和实现17. 事件总线18. 项目相关    1. 介绍 OJ 重构项目、人员规模、开发周期、你负责的内容    2. 为什么要重构    3. 重构时如何保证系统功能稳定性    4. 为什么选择 Pinia 而不是 Vuex    5. 组件库的选择考量    6. 介绍大模型对话组件，背景、出发点、开发周期    7. 流式传输协议怎么实现的    8. 虚拟滚动技术怎么实现的，开始与结束的索引怎么计算的19. 算法：最长递增子序列隔了一周挂了，有些没答上来，有些说的不够广不够深，算法看错题了(ಥ_ಥ)

写在前面：实习秋招春招拿了各种 offer，目前签约了上海的某厂，两段实习助我在春招一路绿灯。从入门到春招锁定 offer 期间，我记录了比较重要的资源，现在分享出来，希望能帮到前端的家人们～​ 🎯适合人群： ​明年找实习，不知如何学习前端的小白们。​ 正在找实习，急需提升竞争力的宝子们。 ​没法找实习，全力冲刺秋招的小伙伴。​ 准备春招，想要汲取经验的同学们。​ 🌟资源亮点：​ 🌈快速入门前端：只聚焦重要技术栈，不走冤枉路，尤其适合前端小白以及半路转前端的家人们。 ​🌈小众新颖项目：提供 react、vue 各两个项目，每个项目都独具特色，还有对应的代码和项目文档资源，助你快速吃透项...

一面（2025/05/06）1. 自我介绍2. 社交、新闻数据聚合平台项目相关    1. 导师项目还是个人项目    2. 架构设计，比如技术选型、前后端怎么设计、怎么考虑并发、预期 TPS 等    3. 爬虫的数据怎么与后端联动的，因为后端用的 Node.js（面试官觉得 Python 与 Node.js 无法直接交互，但我们后端的作用只是负责给前端提供数据，爬虫的数据会直接写入数据库然后被分析）3. OJ 项目相关    1. 权限设计    2. token 怎么存的，为什么这么存，存在本地安全吗，如果重新设计该怎么做确保安全（回答的存在服务端，然后客户端使用 id 去拿到服务端的 token，id 存在 cookie 里，似乎有其他更好的办法）    3. 那怎么确保这个 id 安全，加有效期限    4. 还有吗，提示：比如我通过 JS 获取到（设置 HttpOnly，禁止脚本获取 cookie）    5. Vue 里面有个路由守卫，可以控制不同权限的用户访问不同的路由。那 js 可以怎么实现呢，如果用户直接浏览器跳转呢（ 回答的前端手动实现路由守卫，控制用户能看到哪些页面，后端权限校验，不通过返回 403）4. 代码输出，说思路（面试官一直在提示，但我没答上来，this 指向没学得好）```jsfunction Counter() {  this.count = 0;  setInterval(function() {    this.count++;    console.log(this.count);  }, 1000);}const a = new Counter()```5. 代码输出，说思路```jsconsole.log(1)setTimeout(function() {   console.log(2)}, 0)const p = new Promise((resolve, reject) => {   console.log(3)   resolve(1000) // 标记为成功   console.log(4)});p.then(data => {  console.log(data)})console.log(5)```6. flex，怎么垂直居中，flex-grow 是什么7. 用 css 实现一个三角形8. 实现一个 Vue 的 keep alive，面试官一直在提示我(ಥ_ಥ)```jsclass KeepAlive {  constructor(maxNum = 5) {  this.cache = new Map();  this.maxNum = maxNum;}  addVNode(key, vNode) {    if (this.cache.has(key)) {      this.cache.delete(key);    } else if (this.cache.size >= this.maxNum) {      const oldKey = this.cache.keys().next().value;      this.cache.delete(oldKey);    }    this.cache.set(key, vNode);  }  getVNode(ley) {    return this.cache.get(key);  }}```9. module 、chunk 和 bundle 的区别10. 实现方法把数组的非零元素放在前面，零元素放在后面，O(1) 空间复杂度```jsfunction moveZero2End(arr) {  let p = 0;  for (let i = 0; i < arr.length; ++i) {    if (arr[i] !== 0) {      arr[p++] = arr[i];    }  }  while (p < arr.length) {    arr[p++] = 0;  }  return arr;}```11. 有没有在用 AI 工具，怎么用的，被夸了，说我接触的很深12. 反问：对我面试的不满之处和建议（被夸了哈哈，说我思路清晰，回答或者做题之前会说思路，建议就是多补齐前端知识的宽度和广度）面试官很会引导你，还会解释自己的问题，面试体验非常的棒。秒约二面～二面（2025/05/08）1. 自我介绍2. 讲一下 HTTP 不同版本的区别（这里一开始说的有些乱了，面试官让我重新总结一遍）3. Vue 2/3 的区别4. Vue 实现倒计时组件5. m 元钱随机分给 n 个人，最大可分到 m/2，最小可分到 0.16. OJ 项目    1. 几个人开发，开发周期    2. 为什么要重构    3. 说一个有挑战的事或难点（这里讲的智能训练流程图的组件封装，但面试官似乎不太满意？让我再说说，我就说了信息聚合可视化项目的难点，说了两个：插件开发 / 爬虫中高价值用户获取整体流程与迭代思路）7. 用过 AI 吗，应用方面的呢8. 对 AI 的基础知识或原理了解多少9. DeepSeek 听说过吗，聊一聊实际使用情况10. 用过 AI 编辑器吗，如 Cursor、Windsurf，使用体验怎么样11.  反问    1. 面试反馈：整体还可以，但是需要打好基础并扩展技术栈如 React，沟通的时候要先理清楚逻辑，AI 浪潮下要对 AI 相关的内容保持关注    2. 多久出结果：一周内    3. 工作时间：实习生宽松一些，早十晚八（意思是正式员工会更晚吗）自我介绍完面试官沉默了一段时间，回答完基础知识又沉默了一段时间，我以为我要寄了！然后算法相关，真的很幸运，面试前十分钟看了牛客上的面经，结果真的问到了！

分享一下之前的面经,就当给自己攒点人品啦拷打实习和项目URL输入到渲染页面的流程水平垂直居中实现方式原型链一个原型链相关的题,讲输出结果闭包闭包的应用场景有哪些for(var i=1;i<=3;i++){ return function(){ return i* i }}讲输出let 和 var的区别说说内存泄露内存泄露的例子promisepromise和async await有什么关系如何选择是使用promise还是async,使用场景有哪些Vue2和Vue3的区别Vue和React的区别双向绑定原理key的作用为什么key可以提升算法效率key一定可以提升效率吗git fetch 和...