帆软26前端面试(已oc)

项目背景（是多人协作？还是自己的学习项目为什么选择vue3？不是reactvue3相较于vue2的提升为什么选择使用piniapinia的优势细说用vue3为啥不用ts？想拷打ts，我直接说不会echarts图表自适应怎么做的？大的echarts图表有渲染性能问题，放大缩小过程加载慢，动画卡顿，怎么处理如果现在请求数据，要做复杂的数据计算，才能在图表上展示，我们该怎么做没太理解，面试官举个例子说，现在有个复杂计算，js是单线程的，就会被阻塞掉，完全做不了任何事情，那这个时候我们怎么处理页面中有很多echarts图表，向下滚动的时候出现白屏和卡顿的情况，怎么优化用户用了你的组件库项目，说页面很卡性能不好，怎么去定位问题回答过程中我说了几个优化方案（懒加载，ssr，浏览器缓存优化）面试官追问怎么判断到底用哪个，怎么定位到底是哪里出问题了导致很卡现在想要监控每个组件的性能数据，该怎么做虚拟滚动列表组件适配暗黑模式怎么做cssmodule用过吗组件库有几个组件，开发者有几个项目挑战点和收获

30min 八股+项目 25min 手撕 + 5min反问1.redux用法，分为哪些部分2.图片懒加载怎么实现3.Intersection Observer会有性能问题吗4.使用时如何解决频繁计算5.图片懒加载第三方库实现6.lazyload什么时候加载真实的组件7.骨架屏优化8.localstorage和sessionstorage的区别9.cookie特殊的性能10.xss攻击11.前端数据类型12.传参的时候基本数据类型和引用数据类型有什么区别13.讲一下链表14.链表和数组存储的使用场景有什么区别15.想在链表中插入一个元素，怎么做16.想在数组中插入一个元素，怎么做17.动态数组如何实现18.扩容的比例19.讲一下栈20.js如何实现栈手撕：做了4个题，有代码输出和函数实现，都要讲思路，强度有点大反问：1.业务 2.结果  

飞书前端一面面经：从基础到实战的技术碰撞一、面试初印象这次飞书前端一面给我的整体感受是节奏紧凑且直击技术核心。面试官风格沉稳，问题由浅入深，既考察基础能力，又注重解决实际问题的思维，是一次很有价值的技术交流。二、面试问题复盘1. CSS 基础考察面试官开场便询问我 CSS 基础掌握程度，我坦诚表示“不是很好”，随后进入具体问题：如何实现三列布局，要求两边宽度固定，中间宽度自适应。我首先提到可以用 JavaScript 监听窗口变化动态调整宽度，但面试官希望用纯 CSS 方案。我迅速想到 Flex 布局，并详细解释了实现思路：.container {  display: flex;}.left, .right {  width: 200px; /* 固定宽度 */}.center {  flex: 1; /* 自动分配剩余空间 */}接着，面试官追问 calc() 函数是否了解，由于平时使用较少，我仅简单说明了它能进行四则运算，用于动态计算 CSS 属性值，比如 width: calc(100% - 400px); 可以配合实现响应式布局。2. 项目与性能优化探讨当被问到 项目中的性能优化经验 时，我如实反馈：目前实习项目和个人项目经验较少，尚未深入接触性能优化模块。面试官没有追问，而是迅速切入算法题环节。3. 算法与代码实现题目1：封装 Promise 重试函数要求实现一个函数，传入请求的 Promise 和请求次数，请求失败时自动重试，达到次数上限后不再发起请求。我给出如下代码：function retryPromise(promise, times) {  let count = 0;  return new Promise((resolve, reject) => {    const run = () => {      promise        .then(resolve)        .catch((error) => {          if (count < times - 1) {            count++;            run();          } else {            reject(error);          }        });    };    run();  });}题目2：实现对象深拷贝我先写出基础版本：function deepClone(obj) {  if (typeof obj!== 'object' || obj === null) {    return obj;  }  let result = Array.isArray(obj)? [] : {};  for (let key in obj) {    if (obj.hasOwnProperty(key)) {      result[key] = deepClone(obj[key]);    }  }  return result;}面试官进一步要求 考虑边界情况，我补充说明：若对象属性为数组，需递归处理数组元素；若属性为函数、正则等特殊类型，需特殊处理。例如，对于函数可直接返回原函数，对于正则可创建新的正则实例。三、反问环节我向面试官提出疑问：“为什么在前端面试中如此看重 CSS 基础？”面试官耐心解答：“CSS 是前端页面布局和视觉交互的基石，良好的 CSS 能力能确保页面高效渲染和兼容性，是支撑复杂业务开发的基础，所以我们会重点考察。”四、面试结果与总结幸运的是，面试结果显示 已通过一面。回顾过程，坦诚承认自身不足并积极思考问题，以及在算法题中清晰的逻辑表达是关键。后续准备二面时，我将重点补足 CSS 知识盲区，积累项目实战经验，尤其关注性能优化相关技术，同时加强对 JavaScript 细节和边界场景的理解。这次面试也让我深刻认识到，扎实的基础和灵活的思维永远是技术面试的核心竞争力。

 1. 回流重绘2. npm yarn pnpm区别3. 幽灵依赖的问题4. 不定高虚拟列表实现5. vue和react区别6. 断点续传如何实现手撕：filter   并发控制  flat（从内部开始拍平的版本）明天二面