前端工程师精选面经合集
9家公司
25篇面经
最新 热门
27届前端实习第一次面试 磐松私募
刚刚结束人生中的第一次面试,非常紧张,在学校闷热的顶楼空教室面的。面试前准备了很多,依旧大脑空白。1.简单的自我介绍(简单的说了姓名,学校,技能,面试官说没了?我感觉下次要说的多一点。。。)2.rem,vh/vm,媒体查询的区别(媒体查询卡住)3.数组去重如何实现(Set,遍历)4.对闭包的理解5.你的项目中有使用到闭包吗(。。。卡住)6.webpack和vite区别(项目打包。。。面试官说vite更轻便,这个我知道但是当时竟然没有说出来)7.Keepalive有了解吗(没有)8.npm,pnpm的区别以及项目中用到了什么9.async,await的本质,以及和promise的关系10宏任务微任务执行顺序11.开始介绍第一个项目12.问了一下项目中图片处理的算法,没有深入13.图片上传之后,前后端分别做了什么(这个项目用node.js写的全栈)14.SSE和 WebSocket的区别,为什么没有选择WebSocket15.如何处理SSE断线重连,数据重复,取消SSE(重复不太清楚,说了数据不完整的解决方法)16.接入大模型后用没有用到prompt进行限制17.JTW登录流程18.token存储在哪里,存储到本地安全性不高你有没有想过后续优化19.大文件上传从68%提升到98%,如何测算的(没改之前上传失败多次,修改之后没有失败过。。。)20.上传的格式有没有要求(做了png,jpg等的筛选)21.路由懒加载、图片懒加载如何实现的22.新消息自动滑动如何实现的(AI做的,确实没有仔细的了解过)23.图片存在哪里(本地,嗯。对。。)24.介绍第二个项目(问了用的什么模型,是否有prompt限制,我只做了前端,练手的,后端不是很清楚。。。)25.fetch请求和原生请求的区别26.项目有没有遇到过内存泄漏(目前没有,我理解错了)27.计时器使用后的处理方式,在哪个时期销毁的28.数据库设计29.如果图片上传速度慢,你回怎么排查30.有没有了解过我们公司31.上级或者老师代码意见不同怎么办(认真分析+学习)32.完成需求和写好代码哪个更重要(完成需求)33.有没有用过ai辅助,用的cursor的那个大模型(c开头的,token比较便宜。。。)34.需求不清楚如何推进工作流程(和对接人员进行讨论,可以先做出大致功能然后细化)35.对这次实习有什么期待吗(学习公司业务流程,个人对公司业务很感兴趣)36.入职时间37.MBTI38.期望薪资(ssob上是200-300,我说都可以,遵从实习生标准)39.反问(公司前端业务:内部组件库,对接的商业公司的要求;公司ai使用率(鼓励员工拥抱ai,但是基础知识要懂,不能只靠ai。。。感觉公司ai使用率并不高))半个小时的时间就结束了,面完大汗淋漓。第一次面试狠狠地揭露了自己的不足,八股不熟练,项目细节不清晰,只关注ai相关的知识了,感觉面试完就已经有结果了。。。面试官的口音和我很喜欢的一个博主很像,莫名有些好感,奈何自己实在是欠缺,场面一度尴尬。接下来要针对自己的不足仔细弥补了,下一次就不会太紧张
点赞 评论 收藏
分享
/feed/main/detail/f2fbeb8379034fbe881d59413767d77f/feed/main/detail/538602d728df42fe9d7ded9df701eaf2/discuss/890981724903993344
前端面试总结面经PDD
流程概览: 通常采用3轮技术面 + 1轮HR面的结构。需要注意的是,该司秋招发Offer的时间节点相对较晚,通常会比其他一线大厂滞后约20天(存在“泡池子”现象,需做好心理预期与时间规划)。1 技术考察侧重点面试不仅关注八股文,更强调查询实战编码能力与算法功底:• 代码手撕(Live Coding):• React 实战: 现场编写组件(如倒计时组件)及自定义Hook;考察useCallback与memo的性能优化组合使用。• 异步编程: 围绕 Promise 的高频场景题,如并发控制、串行执行、请求重试机制等。• 算法基础: LeetCode 常见题型,重点关注数学逻辑与数组操作(如无重复字符的全排列);框架底层相关算法(如 Vue3 Diff 中的最长递增子序列 LIS)。• 实习/项目深挖:• 校招中,面试官会重点关注你过往的实习经历。虽然具体业务可能与入职部门不完全匹配,但需清晰阐述项目的业务背景、技术重难点、个人解决方案。• 加分项: 项目中是否有结合 AI 的实践(如 Copilot 提效、AIGC 应用落地等)。2 基础理论与底层原理此部分考察深度较深,需具备源码级或架构级的认知:1. 框架深度(React & Vue):• 考察全家桶的细节使用,通过询问具体 Hook、路由配置、状态管理方案来验证真实性。• React 进阶原理: 重点掌握 React 16+ 的特性,特别是 Fiber 架构(包括双缓存机制、更新流程:触发更新->渲染-Reconciler->提交-Commit)、Element 与 Fiber 对象的区别,以及并发模式(Concurrent Mode)和服务端组件(RSC)的概念。2. 工程化体系:• 构建工具原理对比(Webpack vs Vite)。• 大型项目管理方案(Monorepo 大仓)。• 自动化流程(CI/CD 流水线搭建与部署)。3. 计算机基础:• 网络与浏览器: 经典题“从输入URL到页面展示”的完整链路解析(DNS、TCP、HTTP、渲染树、重排重绘等)。------这个版本适合作为个人复习大纲或面经分享。需要我根据你自己的简历经历,针对性地模拟几个技术深挖的问题来帮你预热这份面试复盘信息密度很高,涵盖了前端高阶岗位(尤其是校招SP/SSP或资深前端)的典型考察路径。为了让它更具逻辑性和可读性,我帮你梳理并润色如下:------4. 面试流程与核心策略流程概览: 通常采用3轮技术面 + 1轮HR面的结构。需要注意的是,该司秋招发Offer的时间节点相对较晚,通常会比其他一线大厂滞后约20天(存在“泡池子”现象,需做好心理预期与时间规划)。4.1 技术考察侧重点面试不仅关注八股文,更强调查询实战编码能力与算法功底:• 代码手撕(Live Coding):• React 实战: 现场编写组件(如倒计时组件)及自定义Hook;考察useCallback与memo的性能优化组合使用。• 异步编程: 围绕 Promise 的高频场景题,如并发控制、串行执行、请求重试机制等。• 算法基础: LeetCode 常见题型,重点关注数学逻辑与数组操作(如无重复字符的全排列);框架底层相关算法(如 Vue3 Diff 中的最长递增子序列 LIS)。• 实习/项目深挖:• 校招中,面试官会重点关注你过往的实习经历。虽然具体业务可能与入职部门不完全匹配,但需清晰阐述项目的业务背景、技术重难点、个人解决方案。• 加分项: 项目中是否有结合 AI 的实践(如 Copilot 提效、AIGC 应用落地等)。4.2 基础理论与底层原理此部分考察深度较深,需具备源码级或架构级的认知:1. 框架深度(React & Vue):• 考察全家桶的细节使用,通过询问具体 Hook、路由配置、状态管理方案来验证真实性。• React 进阶原理: 重点掌握 React 16+ 的特性,特别是 Fiber 架构(包括双缓存机制、更新流程:触发更新->渲染-Reconciler->提交-Commit)、Element 与 Fiber 对象的区别,以及并发模式(Concurrent Mode)和服务端组件(RSC)的概念。2. 工程化体系:• 构建工具原理对比(Webpack vs Vite)。• 大型项目管理方案(Monorepo 大仓)。• 自动化流程(CI/CD 流水线搭建与部署)。3. 计算机基础:• 网络与浏览器: 经典题“从输入URL到页面展示”的完整链路解析(DNS、TCP、HTTP、渲染树、重排重绘等)。
查看12道真题和解析
点赞 评论 收藏
分享
/feed/main/detail/51e4e23907f44929a56d3f65bc046adc/feed/main/detail/5af1e16d96084a6ca3e4df3b81ac1e9f
字节 存储 前端一面
查看19道真题和解析
点赞 评论 收藏
分享
/feed/main/detail/0d8d3ffd5fcf441992e39678947c91d6/feed/main/detail/338f0deed1874fcba6ef14fa2fd0e7c8/feed/main/detail/b0f58064ebdf42a389f269f23b975b6d
字节前端面试分享
一直在牛客看别人的分享,终于有一天自己也能做分享了,字节推流程还是很快的,纪念我的暑期收官timeline:5.15 一面5.21 二面5.25 三面5.27 hr 面5.29 offer一面:全程项目问题,无八股,手撕只让说了下思路,一个括号匹配还有一个忘了(但不难)二面:全程八股拷打,无手撕1. 为什么想做前端2. js 闭包及其风险3. js 引擎你了解什么,异步任务怎么实现的,nodejs 里怎么做4. 从输入 url 到渲染页面的整个过程,渲染过程中具体哪些工作5. css 样式优先级6. 给按钮添加点击事件的几种方法,除了内联属性呢,你知道 addEventListen 的哪些属性,usecapture 的作用7. 图片懒加载的方法,它的表现是什么样子的,如果没有 loading 这个方法改用 js 去实现可以怎么做,他是怎么判断图片到视口位置的8. 做多帧/连续帧的动画有哪些方式,支持动画的图片格式有哪些9. 你怎么提升页面的秒开率,给你一个页面让你做性能优化你的整个流程,有哪些指标,怎么验收测试10. 你对 agent 的理解,和直接给 llm 有什么区别,你在 ai coding 中遇到什么问题,怎么让 ai 更符合期望地工作,用哪个 ai 工具比较多11. 除了前端你还了解哪些技术栈,有没有实际操作,linux 命令知道哪些12. 你在生活中有哪些爱好,有没有用技术手段去解决13. mcp 和 skill 的理解,有没有自己开发过三面:项目简单拷打+手撕:promise并发调度,版本号排序1. 你怎么理解qiankun框架,mpa 不能实现吗,js 隔离与 css 隔离的原理,沙箱隔离的底层原理,css 隔离还了解哪些其他方案2. 说说你在 xxx 这个项目的难点+深入提问这里匿名,于是分享下真心话,从三月底开始大大小小的投递与面试,中间经历了无数次迷茫、崩溃、失眠,看着其他同学陆续上岸,心态一再受打击,收到不甚满意的 offer 也曾想过有个班上就挺好了,要不到此为止吧,但一想到即便入职也过不去心里那道坎,还是决定再试试。我当然知道这是围城,可是有些事自己不体验一下是不会甘心的。最后我想说找实习心态最重要,实力与运气并存才能有满意的结果,我自认为差不多的面试表现,不同面试官会给出截然相反的评价。所以不要妄自菲薄,努力最大的意义是提高自己被看见的概率,面试最大的意义是增强自己的抗压能力,即便我未来可能会转行,可能会后悔,但这段经历能让我接受失败是人生的常态,能让我在持续低气压中保持学习状态、持续做正向的事情。祝大家都拿到满意的结果~
查看15道真题和解析
点赞 评论 收藏
分享
/feed/main/detail/a3136b5933214cb2be35a0ab9a2ca213/discuss/889546972099584000/feed/main/detail/3ae547a14e224f32ab797245ea3eaaef/feed/main/detail/5677b59c77024823b50b09841361b607/discuss/889072230636765184/discuss/888855534063894528
阿里-优酷-前端开发-三面
查看17道真题和解析
点赞 评论 收藏
分享
/feed/main/detail/ec2d3e05d6294c26ac70bfd56a1a7429
qq音乐会员 暑期前端一面
自我介绍与经历请做简单的自我介绍介绍三段实习经历及主要工作内容上一段实习结束/未转正的原因是什么JavaScript 基础for(var i=0; i<<5; i++) { setTimeout(() => console.log(i), 1000) } 输出什么?为什么?严格模式下使用未声明的变量会怎样?解释闭包及其常见陷阱事件冒泡与事件捕获的区别及执行顺序stopPropagation 与 preventDefault 的作用与区别ReactuseState 在定时器中出现闭包问题的原因是什么?如何修复?useRef 与 useState 的区别?使用 ref 为什么不会触发重新渲染?useEffect 依赖数组的作用及空数组的陷阱函数式更新 setState(prev => prev + 1) 的优势手写代码实现 delay(ms) 睡眠函数实现并发控制:限制同时发起的异步请求数量(如图片预加载限制并发数为5)使用 Promise 实现异步任务的调度与队列管理项目深挖(组件库/工程化)组件库如何做到逻辑层与 UI 层分离?双端(PC/移动端)复用的方案是什么?如何在不破坏 PC 端的情况下为移动端扩展特定逻辑?组件库 AI 集成(MCP/Skills)解决了什么痛点?具体架构是怎样的?如何处理组件库多版本文档的匹配问题?性能优化代码分割(Code Splitting)的原理及实现方式ESM 与 CJS 的区别?为什么 Tree Shaking 依赖 ESM?图片懒加载的实现方案(IntersectionObserver / scroll 监听)WebP 格式的优势及兼容性降级方案预加载(preload/prefetch)与懒加载的区别核心性能指标:FCP、LCP、CLS、FID 的含义及优秀阈值网络与浏览器HTTP/1.1、HTTP/2、HTTP/3 的核心区别与优化点HTTP/2 的多路复用解决了什么问题?如何根据 User-Agent 判断浏览器/WebView 版本及特性支持?
查看28道真题和解析
点赞 评论 收藏
分享
/feed/main/detail/dff614efea154480aa59d08b92332fb8/discuss/888142118814818304
阿里-优酷-前端开发-二面
1. 自我介绍2. 介绍 Zustand、Redux、useContext(讲解具体使用方法)3. 询问状态管理库产生的背景是什么?4. 当项目复杂到什么程度的时候需要引入状态管理库?5. Axios 解决什么样的问题?项目里做什么样的二次封装?最复杂的拦截器是什么?(深挖,讲代码)6. 介绍 RAF 机制7. 前端项目性能如何优化?(深挖)8. 前端项目中如何对接后端?(深挖)9. 前端项目中最大的挑战是什么?(深挖,讲解解决全流程)10. 前端项目现在的遗憾或者缺点是什么,你想添加什么功能?(深挖,为什么要加,怎么加)11. 如何说服甲方添加新功能,挑战有哪些?12. 介绍 Agent loop13. 场景题:如何设计开发优酷的Skill?14. 场景题:如何在 AI 应用作为流量入口的情况下,在优酷跟别的视频平台的竞争中,怎么能让用户更好的拿到优酷的内容?15. 介绍 Prompt Engineering、Context Engineering、Harness Engineering16. 介绍 Harness Agent 项目17. Harness 有无对比不同的模型?对模型优劣的感知有哪些?18. Agent 安全性如何保证,怎么能够商用化?(深挖,偏场景题)19. 介绍自己平时怎么使用 AI ?20. 介绍自己 AI Coding 做的最复杂的一个功能?(深挖,讲代码)21. 如何把 AI Coding 的代码快速部署使用?22. 除了用 AI 写代码,还做哪些事情?23. 谈谈AI对新老程序员的改变,新手依托AI写代码缺失问题解决经验该如何弥补,以及AI时代程序员如何提升自身核心竞争力?24. AI Coding 题目25. 反问环节面试时长约75分钟,体感比一面好。面试官人很好,提的问题贴合真实开发场景,不是纯八股,和AI热点结合的场景问题很多,也会引导回答!
查看24道真题和解析
点赞 评论 收藏
分享
/feed/main/detail/48ec4df2fce541238dbe8b23ccc03a12/feed/main/detail/3ea4f786b1d94292ab97c018ba59417d/feed/main/detail/d0f5d92ddedc4200bbe2b8f4cf0a1fc1
玩命加载中
写面经
发动态
发动态
发帖子
写文章

全站热榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务