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

## 时长 70 分钟 北京合思招聘系统### 1.自我介绍环节### 2.做题环节（20 分钟左右）有 22 道选择（html,css,js,数据结构),一道算法题：字符串去重，我和面试官简单说了一下思路（new Set),然后他让我随便写一点交卷了### 3.项目，场景和八股环节（这个环节持续太长了，有些我实在是忘了）1.你是如何做到首屏优化的2.讲讲 CI/CD 是如何实现的3.项目中有使用过 webpack 和 vite 吗4.webpack 和 vite 有什么区别5.有没有使用过什么状态管理工具6.项目使用了什么缓存机制这里我展开讲讲。关于缓存数据，蜀黍使用了缓存头(Cache-Control)和 localStorge。项目中使用了 Promise.all 来进行并发请求，同时从服务器和本地缓存请求数据7.怎么获取的缓存数据localStorge，状态码 3048.缓存的过期时间9.NextJS 中如何设置代码在客户端运行10.NextJS 如何设置服务端运行（好像是这个问法)11.useEffect 中如何进行数据请求（丝滑切换至场景题）12.如果不同 useEffect 中相互依赖过多怎么办（反问面试官，竟然是退化至使用类式组件）13.如果我想让我的 useRef 使用外部的 props 应该怎么办（forwardRef）14.当我的父组件将一个可能会经常变化的 props 传递给子组件时，应该怎么办（useMemo）15.我想全局管理 props,并且防止出现 props drill 的问题，应该怎么办（useContext）16.我想使用 useRef 来实现一个可以返回窗口顶部的功能，应该怎么实现，使用哪些 API17.我想将一个二维数组转换为一维数组怎么办18.如果我的二维数组中不完全都是数组怎么办（instanceof、Array.isArray）19.实现 add(1)(2) === 3 （函数柯里化）20.如何实现 string 和 number 之间的相互转换21.如何改变 this 的指向22.你有没有用过什么 ES6 的新特性23.Promise 打印顺序```javascriptconst promise = new Promise((resolve, reject) => {  console.log(1)  resolve()  console.log(2)})promise.then(() => {  console.log(3)})console.log(4)```24.有没有使用过 typeof25.flex 布局中如何实现水平垂直居中26.如何消除 float 带来的影响27.给定一个完整的 URL，如何获取其查询参数28.React 19 和 React 18 有什么区别29.项目中是否有采用什么对静态资源的优化可能还有，但是暂时想不起来了## 时长 15 分钟 洋葱学园1.对于一个列表，我们通常会给其添加一个 key,可以不添加吗，如果不添加是否有什么问题？2.对于一个 H5 页面加载过慢，如何优化3.将 URL 输入搜索栏，浏览器会做什么4.如何实现进入视窗才进行懒加载5.如何在一个 JS 文件中白屏时返回 Loading 组件（我直接说了 React 和 NextJS 中如何实现哈哈）6.移动端适配7.如何处理重复的请求（本人说了 axios cancelToken、防抖和节流解决这个问题）我确实记得应该还有，但是想不起来（

自我介绍介绍项目useMemo 和 useCallback 的在项目里的作用图表怎么优化的性能整体页面优化怎么做的怎么监测项目性能请求库封装了哪些功能手撕 完整体防抖大文件上传整体实现方法使用 Taro 遇到的问题，解决方法React16 更新了什么，Fiber 的核心手撕请求重试 retryGet(func,times,interval)web 和 RN 为什么性能上有区别（秒开）反问上午面下午约二面了#牛客AI配图神器#

下午面完第二天下午hr加微信了  面试通过进入审批流程全程拷打项目 , 有点汗流浃背了另外提一嘴 , 鼠鼠几乎每一个面经都提到过自己的算法不好 , 可能大家不太了解什么程度 , 今天就遇到了比较简单的算法题 , 但鼠鼠还是没有撕出来 , 有点难过 , 以后一定要多刷算法题1.为什么学前端2.为什么要用fiber架构 , 以及为什么要用链表结构3.讲一下你的hook4.hook是如何具有感知上下文的能力的5.你的useState如何实现的6.你的useState如何存储数据的呢7.多个setState同时调用的话 , 是怎么处理的算法题8.最长递增子序列 (没写出来 , 被自己蠢哭了 , 讲了一种暴力的思路)9.反转链表 (秒了)继续拷打项目10.为什么用WebSocket而不用HTTP11.WebSocket的心跳包是怎么写的你还记得吗12.WebSocket这么好 , 他有什么缺点吗 , 是不是什么时候都优先用WebSocket13.用axios做了什么14.提到写了一个Loading , 怎么做的15.除了加Loading还有什么方法 (防抖)16.手撕防抖17.最快到岗时间面试体验真的很好 , 面试官非常和蔼 , 算法写不出来也会提示我 , 期待成为团孝子

前言还记得上周我们团队在招聘前端工程师，一个看起来经验丰富的候选人坐在我对面。"你们项目中是如何处理按钮重复点击的问题的？"我抛出了这个看似简单的问题。"这个简单，使用防抖就可以了。"他很快回答。然而，当我继续追问细节时，他却陷入了沉思...实际上，这个问题看似简单，但是要真正的解决好，需要考虑很多细节。在我面试了很多候选人中，能完整答出来的不到20%。问题背景在日常开发中，我们经常会遇到这样的场景：用户疯狂点击提交按钮表单重复提交导致数据异常批量操作按钮被连续触发这些问题如果处理不当，轻则影响用户体验，重则可能造成数据错误。今天，就让我们通过一个真实的...