giser666 level
获赞
455
粉丝
135
关注
79
看过 TA
3179
门头沟学院
2026
前端工程师
IP属地:江苏
前端|快手 京东 拼多多
私信
关注
03-06 16:28
已编辑
门头沟学院 前端工程师
小红书|字节|京东|快手|拼多多|滴滴|得物|携程等前端面试AI频繁题目1. SSE 与 WebSocket 区别- 通信方向:SSE 是服务端单向推送给客户端,WebSocket 是双向全双工- 协议:SSE 基于 HTTP,WebSocket 是独立的 ws/wss 协议- 数据类型:SSE 只支持文本,WebSocket 支持文本和二进制- 重连:SSE 浏览器自带自动重连,WebSocket 需要自己写心跳和重连- 使用成本:SSE 非常简单,前端用 EventSource 就行;WebSocket 需要服务端支持协议升级- 适用场景:SSE 适合通知、日志流、AI 流式输出;WebSocket 适合聊天、游戏、协同编辑、直播简单理解:SSE:客户端连上去,服务器一直发消息过来WebSocket:客户端和服务器随时可以互相发消息---2. 对 AI 基本概念了解:RAG、Agent、FunctionCall、MCP、Skills- RAG:先检索外部资料,再让模型回答,用来解决模型瞎编、知识过时的问题- Agent:能自己思考、做计划、调用工具、一步步完成任务的智能体- FunctionCall:模型调用外部接口或函数的标准方式,比如查天气、查数据库- MCP:模型和外部系统、工具之间通信的统一协议,方便对接各种能力- Skills:把常用功能封装成可复用的技能,比如写代码、生成图表、总结文档它们的关系:用户提需求 → Agent 作为大脑 → 用 RAG 查资料、用 FunctionCall 调工具、用 Skills 执行能力 → 通信靠 MCP 协议---3. 个人 AI 技能了解(可直接背)- 了解大模型基本原理和提示词工程- 能基于 RAG 搭建私有知识库问答- 理解 Agent 工作流程,会使用 FunctionCall- 能做前端+AI 项目,比如对话界面、流式输出- 了解多 Agent 协作和常用框架- 能独立完成需求拆解、AI 方案设计与落地---4. 了解主流模型有哪些及各自特点、应用场景国际模型:- GPT-4o:综合能力最强,多模态好,代码、推理都很强- Gemini:谷歌多模态,图片、视频理解能力突出- Claude:擅长超长文本,安全性、合规性好- Llama:开源模型,可以本地部署、二次开发国内模型:- 文心一言:中文理解好,知识覆盖全面- 通义千问:阿里生态,适合电商、客服、业务系统- 讯飞星火:语音能力强,教育、医疗场景多- Kimi:超长上下文,适合读文档、总结资料---5. 用了什么 IDE 以及对比- VS Code:生态最丰富、轻量、插件多,日常开发主力- WebStorm:智能提示、代码重构强,适合大型项目和团队- Cursor:AI 原生编辑器,代码生成、对话一体,AI 开发首选- Zed:启动快、操作流畅,追求高效编码可以用总结:日常用 VS Code,AI 开发用 Cursor,大型项目用 WebStorm。---6. 多 Agent 有了解吗多 Agent 就是多个智能体分工合作,像一个团队一起完成复杂任务。- 分工:有的负责规划,有的负责搜索,有的负责写代码,有的负责测试- 通信:智能体之间可以传递信息、对齐目标- 优点:复杂任务更稳定、逻辑更清晰、更容易维护- 常用框架:AutoGen、CrewAI、LangGraph简单流程:用户提需求 → 主管 Agent 分配任务 → 各个智能体分别执行 → 汇总结果返回给用户---7. AI 在实习部门中应用场景- 智能客服、内部问答:用 RAG + 对话界面- 代码生成、自动补全、代码解释:用 Cursor、Copilot 这类工具- 需求文档、接口文档自动生成与总结- 前端页面自动生成:根据描述或草图生成代码- 数据可视化、报表自动生成:自然语言转图表- 测试用例、测试脚本自动生成---8. Agent 底层原理:ReAct、Transformer 了解ReAct:- 就是推理 + 行动- 流程:先思考要做什么 → 调用工具或执行动作 → 观察结果 → 再思考 → 直到完成任务- 是现在大多数智能体的核心逻辑Transformer:- 是现在所有大模型的基础架构- 核心是自注意力机制,能理解上下文、语义关联- 前端层面只要知道:它是模型用来理解语言、生成内容的底层结构---9. 现有需求如何用 AI 实现:拆解小需求、AI 规划、实现、测试,包含 /plan、/spec标准流程:1. 需求拆解:把大需求拆成小模块,明确每个模块做什么2. AI 规划 /plan:明确目标、执行步骤、输入输出、依赖项、时间安排3. 方案设计 /spec:确定接口、数据结构、页面逻辑、提示词、异常处理4. 实现:前端界面 + 模型调用 + RAG 或 FunctionCall 集成5. 测试:测试功能是否正常、有没有幻觉、流式输出是否稳定、异常情况是否处理6. 上线与优化:根据效果迭代提示词、流程、模型参数简单模板:/plan:目标 → 步骤 → 分工 → 时间/spec:接口 → 字段 → 页面 → 提示词 → 异常处理
查看9道真题和解析
0 点赞 评论 收藏
分享
1. “你平时怎么用AI写代码?”❌ 错误回答:“我用ChatGPT查语法,复制粘贴。”✅ 核心回答要点(体现深度):“我主要使用Cursor作为主力IDE,配合Agent模式。我不把它当‘搜索引擎’,而是当作‘结对编程的资深同事’。我的工作流是:@plan 让它帮我拆解复杂需求(如权限系统),@code 生成脚手架,然后我手动介入进行业务逻辑微调和性能优化(如防抖、虚拟滚动)。我坚信AI负责‘搬砖’,人负责‘设计蓝图’和‘质量把关’。”2. “AI生成的代码有安全或性能隐患,你怎么处理?”❌ 错误回答:“我一般直接相信它,很少检查。”✅ 核心回答要点(体现专业性):“我遵循‘不信任原则’。AI生成的代码我必做三件事:1. 代码审查:重点检查XSS注入点(如innerHTML直接渲染用户输入)、内存泄漏(如未清理的EventListener)和依赖安全性(如eval函数)。2. 性能压测:对于复杂组件,我会用Chrome DevTools的Performance面板跑一下,看有没有不必要的重渲染或长任务阻塞。3. 边界测试:手动补充空值、超长字符串等边界Case,因为AI经常忽略异常处理。”3. “如果AI让你失业了,你怎么看?”❌ 错误回答:“我很焦虑,怕被替代。”✅ 核心回答要点(体现格局):“AI淘汰的不是前端,而是‘只会切图、写业务CRUD’的前端。它把我们从重复劳动中解放出来,让我们有更多时间去做AI不擅长的事:• 架构设计:AI能写模块,但设计不了微前端架构和状态管理方案。• 用户体验:AI不懂‘情感化设计’,不知道什么时候该加个Skeleton加载动画。• 工程闭环:CI/CD流水线、Docker容器化、监控告警,这些需要人的全局视角。我的定位是‘AI驾驶舱的飞行员’,而不是被替代的零件。”4. “举个你用AI解决实际难题的例子?”❌ 错误回答:“我用它写了个TODO List。”✅ 核心回答要点(STAR法则):S(情景):项目有个老旧的jQuery插件导致首屏加载慢2秒,但没人敢动。T(任务):用现代框架(Vue3)重写,并保持功能一致。A(行动):我用GPT-4V截图识别了原插件的DOM结构,让Claude生成等效的Vue3 Composition API代码,并让Cursor帮我将jQuery的链式调用重构为响应式数据。R(结果):包体积减小70%,首屏时间优化到1秒内,且代码可维护性极大提升。”
查看4道真题和解析
0 点赞 评论 收藏
分享

创作者周榜

更多
关注他的用户也关注了:
牛客网
牛客网在线编程
牛客网题解
牛客企业服务