Shopee前端日常一面(30min)整理笔记(四十)
1. 图片上传的前后端逻辑怎么做(流程、图片传输形式与编码解码)
答案
图片上传通常按“选择文件 -> 前端校验 -> 上传 -> 服务端存储 -> 返回地址”来做。
- 前端先校验文件大小、类型、尺寸。
- 一般通过
multipart/form-data上传二进制文件,不建议把大图转 base64 再传,因为体积会膨胀。 - 服务端接收后做存储、压缩、生成缩略图或安全校验。
- 最后返回图片访问地址,前端拿这个地址做展示。
2. 讲讲 Zustand(理解、persist 持久化)
答案
Zustand 是一个很轻量的状态管理库。
- 心智负担小,不需要像 Redux 那样写很多模板代码。
persist中间件可以把部分状态持久化到 LocalStorage 或其他存储介质。- 适合中小型项目或局部全局状态,不适合拿来替代所有服务端状态。
3. 无限滚动如何实现(Intersection Observer,DOM 过大后的优化思路)
答案
无限滚动一般会在列表底部放一个哨兵元素。
- 当哨兵进入可视区时,触发加载下一页。
- 浏览器优先用
IntersectionObserver,比手写scroll监听更高效。 - 如果 DOM 越滚越大,要结合虚拟列表、分页和懒加载一起做。
4. 为什么选择 TanStack Query
答案
选择 TanStack Query 的核心原因是它把“服务端状态管理”做得很完整。
- 内置请求缓存、去重、失效重取和后台刷新。
- 能把接口请求状态和 UI 解耦,不需要手写大量 loading/error/cache 逻辑。
- 对列表分页、条件查询、乐观更新这类场景特别省心。
5. 项目未来上线后可能存在什么问题
答案
项目上线后常见问题一般从性能、稳定性、安全性和可维护性四个维度看。
- 性能上可能有首屏慢、长列表卡顿、内存增长。
- 稳定性上可能有接口超时、流式中断、重试风暴。
- 安全上可能有 XSS、鉴权和文件上传风险。
- 工程上还要考虑监控、日志、灰度和回滚。
6. 常用哪些 Git 操作
答案
常用 Git 操作可以按日常流程回答。
- 查看状态:
git status。 - 提交代码:
git add、git commit。 - 同步代码:
git pull、git fetch。 - 分支协作:
git branch、git checkout/switch、git merge、git rebase。 - 排障和修复:
git log、git reflog、git revert、git cherry-pick。
7. 常用哪些 AI 工具辅助开发
答案
AI 相关题最好回答成“工具边界 + 落地方式”。
- AI 适合做样板代码、重构建议、测试用例、文档整理和方案对比。
- 真正落地时要给它足够上下文,比如代码规范、目录结构、接口文档、历史实现和约束规则。
- Skills / MCP / Agent 可以理解为不同层级的能力扩展:Skills 偏可复用能力包,MCP 偏工具和上下文接入协议,Agent 偏任务编排和执行过程。
- AI 不能代替工程判断,核心链路仍然要靠人 review 和兜底。
8. AI 结合项目的使用方式
答案
AI 结合项目最关键的是“让它理解上下文,再做有边界的协作”。
- 可以用 AI 做方案拆解、样板代码、测试用例、文档整理。
- 要提供项目结构、代码规范、接口定义和参考实现。
- 关键业务逻辑和线上风险点仍然要人工把关。
9. Code Agent 底层理解
答案
AI 相关题最好回答成“工具边界 + 落地方式”。
- AI 适合做样板代码、重构建议、测试用例、文档整理和方案对比。
- 真正落地时要给它足够上下文,比如代码规范、目录结构、接口文档、历史实现和约束规则。
- Skills / MCP / Agent 可以理解为不同层级的能力扩展:Skills 偏可复用能力包,MCP 偏工具和上下文接入协议,Agent 偏任务编排和执行过程。
- AI 不能代替工程判断,核心链路仍然要靠人 review 和兜底。
10. PromiseAll
答案
带并发限制的 Promise.all 核心是维护一个“运行中任务池”。
- 同时只启动
k个任务。 - 任意一个任务完成后,再从等待队列里补一个新的进去。
- 结果数组要按输入顺序回填,而不是按完成顺序 push。
- 全部任务结束后再统一 resolve;如果设计成首错即停,要在出错时及时 reject。
11. 数组扁平化
答案
数组扁平化常见有三种写法:递归、显式栈、flat(Infinity)。
- 面试里更推荐递归或栈模拟,因为能顺便讲时间复杂度。
- 如果题目要求兼容性或不允许直接调 API,就不要只写
flat。