学习前端多久了，为什么选择前端，平时怎么学习前端js1.TS在浏览器能直接运行吗？怎么编译成js2.箭头函数和普通函数区别3.promise用过吗，手写一个promise封装一个setTimeout计算机网络1.TCP和UDP区别2.拥塞控制3.HTTP请求方法4.GET和POST区别5.浏览器缓存6.怎么配置强缓存跟协商缓存7.强缓存跟协商缓存能同时配置吗，优先级如何CSS1.垂直居中2.实现三角形，问了利用什么特性3.实现等腰梯形手写1.url参数提取2.合并两个有序数组

11/20 火山引擎一面如何选择学习前端的学习前端过程中的感受学习过程中一些自己解决得比较有难度，比较有成就感的事页签为什么不用第三方库，和你自己做的区别是什么不同页签之间的 url 相同吗如何区分不同页签的（动态路由参数）说一下你对 websocket 的了解Websocket 如何拿到历史消息说一下文件在服务端被 ai 解析的大致流程，涉及到了哪些技术平时有用一些 ai 工具吗介绍一下双 token 无感刷新的原理请求出错时如何处理为什么不用单 token，直接延长 token 有效期不行吗为什么不全部存在 cookie 里Http 状态码有哪些500 系列一般代表什么如何处理跨域Cors 能设置哪些字段，能设置什么维度的跨域，除了域名还能设置什么什么是组合式 api，有什么好处虚拟 dom 是什么为什么一些框架的最新版在尝试去掉虚拟 dom实现一个 event 类Js 编码二叉树的实现与遍历Js 闭包应用手写11/27 火山引擎二面自我介绍接触前端时间，怎么学习的介绍一下项目，包含业务场景介绍一下技术难点介绍一下基于 websocket 的库的选择你提到了自己封装了 websocket 类，和这些库的区别是什么描述一下这个类主要的功能和 apiStomp 和 websocket 的区别是什么从网络协议七层模型上看的话，stmop 位于哪一层Tcp 和 udp 的区别Stomp 支持二进制数据传输吗还了解别的类似 stmop 的协议吗知识库用到了 rag 吗介绍第二个项目有用到微前端吗你提到了多页签功能，页签之间的隔离怎么做的权限控制的力度是怎么样的，做到了什么层级登陆怎么做的，基于 sso 还是 oauth介绍一下你了解的 oauth 的底层原理登陆态是如何保存的Jwt 的优势是什么Keep-alive 的底层原理是什么讲讲泛型判断一个变量的类型有多少种方法Promise 有多少种状态Promise all 和 race 的区别Race 的第一个失败了怎么办，会执行第二个吗，返回结果是什么前端的网络安全了解 csp 吗说一下对前端工程化的理解前端有哪些性能优化的手段了解 webpack 的 model federation 吗最小子数组和（不要求时间复杂度）实现一个 event 类12/02 字节火山三面自我介绍介绍部门业务，商业化逻辑自己的规划是什么样的介绍学生干部经历，比赛经历如何激励同学们参加学生活动的比赛中团队做了什么，自己做了什么事你觉得你们的比赛课题有实践前途吗复盘的话后续有哪些可以优化的点讨论比赛项目前端当中，做的那些事对个人成长帮助比较大说一下产品形态和技术方案这个项目是你从 0 到 1 去做的吗你刚开始的时候是如何设计代码框架的为了保证项目的扩展性，做了哪些抽象详细介绍业务拆分逻辑，一直往下拆分的话会到什么程度一个比较完整的技术方案需要包含哪些内容如何确保工程稳定性，怎么选择一个好的技术栈做业务的时候涉及到了哪些，技术栈当中有没有需要提前确定的部分什么时候开始学习的前端有什么快速学习的方法吗工作过程中，你喜欢和不喜欢和拥有什么特质的人合作针对不喜欢的人如何共处你会去做 final call 吗，强行做决定可能有哪些问题反问秋招最后的面试了，拖了好久的面经一直懒得写，但看起来有不少同学应该用得上，还是写出来了，字节的三面确实会更注重考察候选者的个人潜质和 leadership，和之前的其他的技术三面感觉很不一样

[详细介绍实习经历]1.前端如何做自然语言校验（大模型相关）[css]1.如何实现对角线三个元素等距排布2.space-between和space-around区别[TS]1.手写pick方法2.联合类型与交叉类型[vue]1.vue2和3区别2.vue2怎么优化响应式（数组方法）3.vue3.6了解吗取消Vdom，有什么优化，取消虚拟dom后在什么阶段执行响应式操作（这个真爆炸了，还好当时xhs刷到过vue3.6，但也只知道取消了Vdom）[项目:问了很多项目细节还有优化上的东西，有些根本没了解过]1.lcp优化2.项目缓存策略3.为什么拆包会变快4.浏览器并行是从http几开始5.npm fix6.pnpm解决了npm什么问题7.什么是幽灵依赖8.浏览器缓存9.indexDB10.如何调用ai时加限制

[拷打实习经历]1.如何实现表单校验（反正拷打的比较狠，问了很多问题，也不是问实习怎么做的，完全就是场景题）2.如何减少api重复调用（依旧场景题，涉及防抖，axio等）3.ai大模型如何减少大模型幻觉4.fcp指什么，如何测量5.具体讲一下fcp优化过程6.刚才讲了缓存，问了强缓存跟协议缓存的区别[vue]1.vue2跟vue3最大的区别是什么2.组合式api的优势特点3.ref跟reactive的区别4.为什么template里面响应式不用value5.vue router两种模式的区别6.用history返回什么7.输入URL之后[nodejs我说没怎么用过他说那不问了][打包工具]1.webpack和vite区别2.vite怎么兼容老浏览器（没答上来，他就没接着问）[拷打项目]1.怎么把上下文穿给大模型（反复问之后发现我不参与大模型调试，放弃继续问）2.流式传输3.反复问细节，有一个细节没答上来他说算了[手撕]删除链表倒数第K个节点[反问]

1.js类型判断2.typeof问题3.判断数组方法4.闭包，闭包的问题5.map跟对象的区别6.事件循环7.css回流与重绘8.vif与vshow区别9. visibility: hidden 、 display: none 、 opacity: 0  的核心区别10. flex: 1  的完整含义  flex: 2  的完整含义11.vue2与vue3的响应式区别12.vue里的key13.vue组件通信14.pinia相比vuex的优点15.ref reactive16.问了一点项目实现17.手撕快排

1.浏览器渲染树2.重排与重绘3.如何减少重排与重绘4.vue如何减少重排与重绘5.diff算法6.垂直居中7.缓存8.闭包9.手写防抖10.输出题，promise链式调用11.手写promiseAll12.问项目细节，没有太深13.vue watch与compute的区别14.vue2与vue3响应式

1. 实习介绍2. 围绕项目简单提问3. 进程 线程4. 进程 rpc5. 进程通信方式6. osi 7层模型7. tcp udp8. tcp 三次握手 → 为什么要三次9. http 请求方法10. http 常用状态码11. http https12. tls → 后续消息通信加密用哪个密钥13. js 数据类型14. null undefined15. let const var16. 闭包17. 事件循环18. 手撕：重排链表19. 反问

项目+八股+手撕1.讲一下RAG2.RAG分片的方法是什么3.react用过哪些hooks，讲一下原理4.react的组件还有其他发生渲染地场景吗5.useeffect设置一个和之前一样的值也会渲染吗6.useeffect设置为空数组呢7.ueeffect和uselayouteffect有什么区别8.如何避免引用类型导致的无效渲染？9.react组件更新的时机有哪些10.讲一下前端打包工具和工程化11.webpack原理12.为什么import一个东西只打包一个东西13.讲一下ant design的动态导入14.讲一下流式对话的输出是怎么实现的手撕：1.实现一个useeffect一样功能的hooks，但是第一次不执行副作用2.给一个[{tag:1,name:'alice'},{tag:'str',name:'bob'},{tag:'哈哈',name:'jack'}]的数据实现一个函数返回[1,'str','哈哈']反问

1.Hooks的作用2.React context的理解3.context和redux区别，它们的适用场景分别是什么4.context和redux在dispatch(action)时的区别5.react fiber的原理，它解决了什么问题6.react fiber具体是如何管理的7.react fiber递归比对 VirtualDOM 树，找出需要变动的节点，然后同步更新它们。相比于原生的方法，有什么优点，为什么提升了性能8.react fiber优先级进行管理，具体是如何触发的，什么时候进入队列，什么时候渲染9.playwright的竞品以及它的优势，参与技术选型了吗10.假设有一个淘宝购物网页，在一个虚拟列表动态加载的场景下：你通过监听scroll事件滑动来遍历得到了整个列表项，如11.果当你渲染需要网络请求数据，如何等待数据返回后渲染12.不停触发滚动的时候 ，可能会遇到取异步新的数据，新的数据不出现怎么办，具体怎么检测呢13.怎么拿到加载的新的数据量，怎么判断还在取数据14.如何判断获取数据的流程，监听请求拦截和响应拦截器嘛15.自动化测试的时候能拿到后端的接口的数据吗16.Playwright 怎么拿到后端的数据

30min 八股+项目 无手撕1.如何实现文件预览2.调用第三方库怎么实现的3.地址栏输入 URL 敲下回车后发生了什么4.浏览器一帧可以完成哪些操作5.浏览器一帧有多久，说了60FPS问转换成时间是多久6.浏览器缓存策略7.ETag是如何计算得到的8.vue是如何进行依赖收集的9.Vue3使用proxy会监听到子孙对象嘛10.学习中遇到过什么困难问题怎么解决的11.遇到过什么困难问题通过另辟蹊径的方法解决的12.二维平面上有2个凸的多边形，怎么判断它们是否重叠反问

45min 八股+项目+手撕1.讲一个项目里面的难点2.ES6的新特性getCashInfo(extParam = {}){const {orderBaseDetailData = {}, quserInfo = {}, isLogin12306}= this.viewstateconst {orderBaseResult = {}}= orderBaseDetailData;const {contactInfo, orderNo} = orderBaseResult;const {userUserID = ''，userName = ''，userID = ''} = qUserInfo;const param ={orderNo,contactPhone: contactInfo.contactPhone || '',uuid:userUserID,userId: userID,userName,hasLogin12306: isLogin12306,cashiersource: 'OCCUPY PAGE CASHIER',cashType: 'ORDER',...extParam}}3.这段代码有什么问题，典型场景，核心作用4.设置定时器延迟时间为100ms，实际延迟时间通常会大于等于 100ms，为什么5.宏任务与微任务6.浏览器的同源策略7.跨域的解决方案8.CORS是什么，具体如何设置9.跨域的post请求为什么会两次10.如果页面有多张图片 http是怎么加载的11.结合TCP连接方面讲一下图片数据请求，串行还是并行12.计算机网络五层常用协议13.用过http抓包嘛14.什么是中间人攻击15.浏览器的地址栏输入网址到界面显示的整个过程16.怎样减少重排重绘17.vue的响应式原理18.vue2和vue3的区别19.diff算法20.react hooks的优缺点21.学习起来遇到什么困难手撕：实现一个函数删除字符串中出现次数>=2的相邻字符：输入"abbbaca" ---> "ca"

1.vue2和vue3的区别2.v-if v-show的区别3.Dom节点的增删对浏览器性能的影响4.一个网页在使用时正常，后面使用出现了卡顿和崩溃，如何检查，如何解决5.九宫格布局的多种实现6.grid布局实现九宫格布局的缺点7.两段 JavaScript 代码输出try {setTimeout(() => {try {throw new Error('error info')} catch(error) {console.error(error)}}, 0)} catch (error) {console.error(error)}try {setTimeout(() => {throw new Error('error info')}, 0)} catch(error) {console.error(error)}这段代码的输出是什么，原因是什么8.setTimeout和setInterval在浏览器如何执行9.你平时是怎么学习前端的手撕：数组元素去重（不能用set和indexof）反问

1.大文件分片上传的原理，如何分片，断点续传，如何记录上传进度2.useEffect和useLayoutEffect的区别3.vue2和vue3的区别4.响应式如何做的5.选项式api和组合式api的区别6.组合式api有什么缺点7.diff算法原理8.vue和react的diff算法的区别9.vue2和vue3的diff算法的区别10.jwt登录机制11.http请求有哪些12.同源策略是什么13.跨域方法有哪些14.CORS的头部字段是什么15.jsonp原理16.除了script;标签，哪些标签可以跨域17.为什么使用proxy代理服务器可以跨域18.数组浅拷贝的方法有哪些19.闭包的使用场景20.webpack打包优化21.loader选型22.为什么使用jwt23.Object.prototype.a = 10;var obj = {b: 20};Object.defineProperty(obj, 'c', {enumerable: false,value: 30,});for (let k in obj) {console.log(k);}输出是什么var obj {24.对应的this指向问题：普通函数调用箭头函数调用方法调用嵌套普通函数箭头函数调用解构赋值后调用}输出是什么

1.React 和 Vue 在底层实现上的核心差异2.为什么有的大公司选择react3.JWT缺陷4.有哪些更较健壮的登陆机制5.登录后 Token 的安全存储6.Token 的cookie泄露怎么办7.怎么知道cookie泄露8.如何识别短时间内高频次请求敏感接口的行为9.浏览器本地缓存机制10.sessionStorage 和内存缓存的区别11.service worker和web worker的区别以及使用场景12.Service Worker 实现离线访问，去离线的理解13.PWA14.计算机进程和线程的区别15.串行 并行 同步 异步的区别16.同步队列  串行队列 等等跟线程的关系17.锁18.多线程安全问题19.如何使用锁，给谁加锁20.三个线程 如何让加锁21.meta标签有哪些属性22.meta标签 name=viewport的作用23.如何监听浏览器到底部24.addEventListener监听如何实现25.平时你怎么学习前端的手撕：两数之和

50min 部门介绍+ 项目+ 反问1.项目遇到的最大的困难2.大文件上传3.断电续传4.秒传5.并发控制6.上传进度显示7.文件解析的技术选型8.性能优化指标9.FCP LCP10.埋点监控无手撕

八股： 1.跨域问题2.什么是同源策略3.数据类型4.localstorage等三个区别5.钩子函数6.url解析过程7.dom树构建8.防抖节流手撕：9.手写一个方法树结构转数组，实现react下拉组件，写完问了react里面key的作用反问：10.技术栈 说用react和vue都有 不用太过担心换技术栈

八股： 1.html中行级元素和块级元素有哪些2.localStorage特点3.实现一个块级元素垂直水平居中4.promise具体用法5.如何实现计时器6.事件循环角度考虑定时器实现问题7.vue的组件通信方式有哪些8.keepalive组件9.keepalive保存的组件name存在哪里10.多个页面都要复用同一个组件，如何存储name11.有个数组，随机数字，如何实现数组求和12.​​将数组 [1, 2, 3, 4] 转换为 [{ name: 1 }, { name: 2 }, { name: 3 }, { name: 4 }] 的实现思路​

八股： 1.css实现动效的方法，语法和应用场景2.html语义化标签有哪些，有什么好处3.SEO优化的方法4.对原型链的理解5.对作用域链的理解6.闭包7.vue常用的生命周期，每个生命周期一般会干哪些事8.vue2和vue3的区别9.vue3是否有兼容性问题场景：10.用户反馈网页加载很慢，你认为这个慢是哪些方面，可以怎么优化

1. css盒子模型2.俩盒子模型代码是啥，区别在哪3.px，em，rem水平垂直居中怎么实现（多说几种)4.css数据类型5.数组常用操作方法6.react生命周期7.es68.前端缓存（localstorage等三个）9.跨域问题10.箭头函数11.箭头函数和普通的区别