美团前端暑期一面整理笔记（四）
1. AI-coding：用 AI 自动生成周报并发送给上级，如何拆分原子任务
答案
这个流程可以拆成下面几步：
- 获取用户本周的工作记录。
- 对工作内容做分类、去重和归纳。
- 提炼成果、问题和下周计划。
- 生成周报草稿。
- 让用户确认和修改。
- 确认发送对象后再发送。
面试里补一句会更完整：真正适合 AI 自动做的是“整理和生成”，不是不经确认直接外发。
2. 哪些步骤 AI 不应自主执行，必须由用户确认或人工介入
答案
必须人工确认的步骤一般有三类：
- 涉及外发动作的，比如“直接发送给上级”。
- 涉及事实真实性的，比如本周成果、风险、对他人的评价。
- 涉及敏感信息的，比如接收人、抄送范围、隐私内容。
判断原则就是：一旦错误会造成业务风险、沟通风险或隐私风险，就不能让 AI 全自动执行。
3. 如果用户没有提供任何本周工作记录，该流程应如何处理
答案
如果没有工作记录，流程不能硬生成一份看起来很完整的周报。
- 先提示用户缺少必要输入。
- 引导用户补充工作内容，可以给结构化表单或问题模板。
- 如果允许，也可以尝试从任务系统、提交记录、日历中辅助拉取数据。
- 在没有可靠数据的情况下，只能生成待补充草稿，不能直接发送。
4. JS 事件循环和输出顺序题
答案
事件循环的主线是：执行一轮宏任务，然后清空微任务队列，必要时进行渲染，再进入下一轮。
- 常见宏任务：
setTimeout、setInterval、I/O、UI 事件。 - 常见微任务：
Promise.then、queueMicrotask、MutationObserver。 - 所以输出顺序题一般先看同步代码，再看微任务，最后看下一轮宏任务。
5. 如果在 promise 中再写一个 setTimeout，输出结果会怎样
答案
这类题的关键是分清微任务和宏任务优先级。
Promise.then里的代码属于微任务。- 在微任务里注册的
setTimeout只是把新的宏任务放进下一轮事件循环。 - 所以通常是：当前同步代码先执行完 -> 清空本轮微任务 -> 下一轮再执行
setTimeout。
6. 流式渲染是怎么实现的
答案
流式渲染通常是“服务端持续返回分片，前端边收边渲染”。
- 服务端按 chunk 或事件流持续输出内容。
- 前端通过
EventSource、fetch + ReadableStream或封装 SDK 持续读取数据。 - 每拿到一段内容，就追加到消息状态里，再触发局部更新。
- 为了避免频繁重渲染，通常会做分帧刷新、批量合并更新或按 token 缓冲后再刷。
7. AI 对话项目的页面布局怎么设计
答案
AI 对话页通常至少分三块：
- 消息展示区。
- 输入操作区。
- 辅助区，比如历史会话、模型设置、文件面板。
如果要讲实现，可以补充状态分层、滚动跟随和移动端适配。
8. 为什么使用 TypeScript，有什么好处
答案
使用 TypeScript 的核心价值是提升可维护性和协作效率。
- 它能在开发阶段提前发现类型错误。
- 对接口模型、复杂表单、组件库和状态管理非常有帮助。
- 重构时更安全，IDE 提示也更完整。
- 团队项目里，类型本身也是一种文档。
9. 高性能渲染怎么实现，怎么保证其他操作不卡
答案
性能优化题一定要讲“指标、手段、结果”。
- 先说明你关注的是 FCP、LCP、首屏时间、交互耗时还是滚动帧率。
- 再说做了什么，比如拆包、懒加载、虚拟列表、分帧渲染、缓存、减少主线程长任务。
- 最后说如何验证：Lighthouse、Performance 面板、埋点平台、真实用户监控。
- 如果问“怎么保证不卡”，关键是把长任务拆小，必要时放到 Worker，并减少一次性大量 DOM 更新。
10. 数组的扁平化
答案
数组扁平化常见有三种写法：递归、显式栈、flat(Infinity)。
- 面试里更推荐递归或栈模拟，因为能顺便讲时间复杂度。
- 如果题目要求兼容性或不允许直接调 API，就不要只写
flat。
11. 合并两个有序链表
答案
这题用双指针和虚拟头结点最稳妥。
- 比较两个链表当前节点值，把较小的接到结果链表尾部。
- 对应指针后移。
- 任一链表遍历结束后，把另一个链表剩余部分直接接上。
- 时间复杂度
O(m+n)，空间复杂度O(1)。