【前端面经】美团-核心本地商业-业务研发平台(暑期,oc)
一面(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 指向没学得好)
```js
function Counter() {
this.count = 0;
setInterval(function() {
this.count++;
console.log(this.count);
}, 1000);
}
const a = new Counter()
```
5. 代码输出,说思路
```js
console.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,面试官一直在提示我(ಥ_ಥ)
```js
class 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) 空间复杂度
```js
function 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.1
6. OJ 项目
1. 几个人开发,开发周期
2. 为什么要重构
3. 说一个有挑战的事或难点(这里讲的智能训练流程图的组件封装,但面试官似乎不太满意?让我再说说,我就说了信息聚合可视化项目的难点,说了两个:插件开发 / 爬虫中高价值用户获取整体流程与迭代思路)
7. 用过 AI 吗,应用方面的呢
8. 对 AI 的基础知识或原理了解多少
9. DeepSeek 听说过吗,聊一聊实际使用情况
10. 用过 AI 编辑器吗,如 Cursor、Windsurf,使用体验怎么样
11. 反问
1. 面试反馈:整体还可以,但是需要打好基础并扩展技术栈如 React,沟通的时候要先理清楚逻辑,AI 浪潮下要对 AI 相关的内容保持关注
2. 多久出结果:一周内
3. 工作时间:实习生宽松一些,早十晚八(意思是正式员工会更晚吗)
自我介绍完面试官沉默了一段时间,回答完基础知识又沉默了一段时间,我以为我要寄了!然后算法相关,真的很幸运,面试前十分钟看了牛客上的面经,结果真的问到了!
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 指向没学得好)
```js
function Counter() {
this.count = 0;
setInterval(function() {
this.count++;
console.log(this.count);
}, 1000);
}
const a = new Counter()
```
5. 代码输出,说思路
```js
console.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,面试官一直在提示我(ಥ_ಥ)
```js
class 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) 空间复杂度
```js
function 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.1
6. OJ 项目
1. 几个人开发,开发周期
2. 为什么要重构
3. 说一个有挑战的事或难点(这里讲的智能训练流程图的组件封装,但面试官似乎不太满意?让我再说说,我就说了信息聚合可视化项目的难点,说了两个:插件开发 / 爬虫中高价值用户获取整体流程与迭代思路)
7. 用过 AI 吗,应用方面的呢
8. 对 AI 的基础知识或原理了解多少
9. DeepSeek 听说过吗,聊一聊实际使用情况
10. 用过 AI 编辑器吗,如 Cursor、Windsurf,使用体验怎么样
11. 反问
1. 面试反馈:整体还可以,但是需要打好基础并扩展技术栈如 React,沟通的时候要先理清楚逻辑,AI 浪潮下要对 AI 相关的内容保持关注
2. 多久出结果:一周内
3. 工作时间:实习生宽松一些,早十晚八(意思是正式员工会更晚吗)
自我介绍完面试官沉默了一段时间,回答完基础知识又沉默了一段时间,我以为我要寄了!然后算法相关,真的很幸运,面试前十分钟看了牛客上的面经,结果真的问到了!
全部评论
正式工可能就周五下班早一点,反正我们部门是周宇晚上7点多就差不多都走了,除了个别有活的,实习生一般就混个餐补8点多就走了
相关推荐
点赞 评论 收藏
分享