1.3 FastAPI → Django → Vue → React 面试题

下面按FastAPI → Django → Vue → React四个模块梳理高频面试题，附代码案例。

一、FastAPI 篇

Q1：FastAPI 的核心特点和优势是什么？为什么被称为“高性能”？

核心答题框架：

FastAPI 是一个现代、快速（高性能）的 Web 框架，其核心优势：

• 极致性能：底层基于 Starlette（ASGI 框架），原生支持async/await，在处理 I/O 密集型任务时高效利用单线程处理成千上万并发连接，性能可与 Node.js 和 Go 媲美
• 类型安全与自动校验：深度集成 Pydantic，利用 Python 类型提示自动完成请求数据的解析、验证和序列化
• 自动生成 API 文档：开箱即用提供 Swagger UI (/docs) 和 ReDoc (/redoc)
• 依赖注入系统：强大且灵活

加分回答：> “FastAPI 的‘高性能’指处理高并发 I/O 的能力；‘快’不仅指性能，也指开发速度——通过类型安全和自动文档，显著提升开发效率。”

代码案例：基础 FastAPI 应用

fromfastapiimportFastAPIfrompydanticimportBaseModelimportuvicorn app=FastAPI()# 定义 Pydantic 模型（自动校验）classItem(BaseModel):name:strprice:floatis_offer:bool=False# 路径操作装饰器 + 类型提示@app.get("/")asyncdefroot():return{"message":"Hello World"}@app.post("/items/")asyncdefcreate_item(item:Item):# FastAPI 自动校验请求体是否符合 Item 模型return{"item_name":item.name,"price":item.price}if__name__=="__main__":uvicorn.run(app,host="0.0.0.0",port=8000)

Q2：FastAPI 的依赖注入（Dependency Injection）是如何实现的？

核心答题框架：

依赖注入是一种解耦组件之间依赖关系的设计模式。FastAPI 中通过Depends实现：

1. 定义依赖项（普通函数或类）
2. 使用Depends标记参数
3. 请求到达时，FastAPI 自动调用依赖函数并递归解析所有子依赖
4. 最终将返回值注入路径操作函数

代码案例：数据库会话依赖注入

fromfastapiimportFastAPI,Depends,HTTPExceptionfromsqlalchemy.ormimportSession app=FastAPI()# 定义依赖项：获取数据库会话defget_db():try:db=SessionLocal()yielddbfinally:db.close()# 定义依赖项：根据 ID 获取商品defget_item(item_id:int,db:Session=Depends(get_db)):item=db.query(Item).filter(Item.id==item_id).first()ifnotitem:raiseHTTPException(status_code=404,detail="Item not found")returnitem# 路径操作函数中注入依赖@app.get("/items/{item_id}")asyncdefread_item(item:Item=Depends(get_item)):returnitem

加分回答：> “依赖注入让代码更可测、更解耦。常见误区是在视图函数内硬编码依赖，正确做法是统一用Depends声明，让框架负责组装。”

Q3：FastAPI 中同步函数和异步函数如何选择？

核心答题框架：

二、Django 篇

Q4：Django 的核心思想是什么？

核心答题框架：

Django 的核心思想是“电池已内置”（Batteries Included）——框架自带常用功能（ORM、认证、表单、模板、Admin 后台等），无需额外找第三方库。同时 Django 遵循MTV（Model-Template-View）架构模式：

加分回答：> “Django 的 MTV 和传统 MVC 本质类似，只是把 Controller 的职责放到了 View 里，而 Template 替代了 View 的展示层。”

Q5：描述 Django 请求的完整生命周期。

核心答题框架：

用户请求 → WSGI 服务器 → 中间件(process_request) → URL 路由匹配 → 中间件(process_view) → 视图处理 → 模板渲染 → 中间件(process_response) → 响应返回

1. 请求发起：浏览器生成 HTTP 请求发送给服务器
2. WSGI 接收：WSGI 服务器将 HTTP 请求转换为 Python 可理解格式
3. 中间件处理：请求依次经过所有中间件的process_request方法（认证、日志、权限等）
4. URL 路由匹配：URL 调度器根据urls.py找到对应视图
5. 视图处理：视图执行业务逻辑（数据库查询等）
6. 模板渲染：视图将数据传递给模板，生成 HTML
7. 响应返回：视图返回响应对象，经过中间件process_response返回客户端

代码案例：自定义中间件

# middleware.pyfromdjango.utils.deprecationimportMiddlewareMixinclassRequestLogMiddleware(MiddlewareMixin):defprocess_request(self,request):# 请求进入时记录日志print(f"Request:{request.method}{request.path}")returnNone# 继续处理defprocess_response(self,request,response):# 响应返回时记录print(f"Response status:{response.status_code}")returnresponse# settings.py 中注册MIDDLEWARE=[# ...'myapp.middleware.RequestLogMiddleware',]

Q6：Django ORM 的 N+1 查询问题是什么？如何解决？

核心答题框架：

N+1 查询指：查询主表 N 条记录后，每条记录又额外查询一次关联表，导致总共 N+1 次 SQL。

代码案例：

# ❌ 产生 N+1 查询books=Book.objects.all()# 1 次查询forbookinbooks:print(book.author.name)# 每本书额外 1 次查询，共 N+1 次# ✅ 使用 select_related（外键、一对一）books=Book.objects.select_related('author').all()# 1 次 JOIN 查询# ✅ 使用 prefetch_related（多对多、反向外键）books=Book.objects.prefetch_related('tags').all()# 2 次查询

加分回答：> “select_related生成 JOIN 查询（适合外键），prefetch_related分别查询后在 Python 层面关联（适合多对多）。选错反而会拖慢性能。”

三、Vue 篇

Q7：Vue3 相比 Vue2 有哪些主要改进？

核心答题框架：

Q8：Composition API 和 Options API 的区别？

核心答题框架：

• Options API（Vue2 方式）：按选项（data、methods、computed）组织代码
• Composition API（Vue3 方式）：按逻辑功能组织代码，在setup()中组合

代码案例：自定义组合式函数（逻辑复用）

// useCounter.js - 组合式函数import{ref}from'vue';exportfunctionuseCounter(initialValue=0){constcount=ref(initialValue);constincrement=()=>{count.value++;};constdecrement=()=>{count.value--;};return{count,increment,decrement};}// MyComponent.vue - 在组件中使用import{useCounter}from'./useCounter';exportdefault{setup(){const{count,increment,decrement}=useCounter(10);return{count,increment,decrement};}};

加分回答：> “Composition API 解决了 Vue2 Mixins 的命名冲突和来源不清晰问题。同时更好的 TypeScript 支持让大型项目更可控。”

Q9：Vue3 的生命周期钩子有哪些变化？

核心变化：

四、React 篇

Q10：React 18 有哪些核心新特性？

核心答题框架：

• Concurrent Rendering（并发渲染）：渲染可中断
• Automatic Batching（自动批处理）：多次 setState 自动合并
• Transitions（startTransition）：标记非紧急更新
• Suspense 增强
• 新的 Hydration API

加分回答：> “React 18 的核心不是新功能，而是调度能力的升级，让 UI 更‘可中断’。”

Q11：useState 和 useReducer 的区别？

核心答题框架：

代码案例：

// useState - 简单状态const[count,setCount]=useState(0);// useReducer - 复杂状态constinitialState={count:0};functionreducer(state,action){switch(action.type){case'increment':return{count:state.count+1};case'decrement':return{count:state.count-1};default:returnstate;}}const[state,dispatch]=useReducer(reducer,initialState);dispatch({type:'increment'});

加分回答：> “useReducer更接近 Redux 思想，适合复杂状态流转。组件内状态管理用useReducer就够了，不一定非要上 Redux。”

Q12：useEffect 的清理函数什么时候执行？

核心答题框架：

1. 组件卸载时
2. 依赖项变化，下一次 Effect 执行之前

代码案例：

useEffect(()=>{consttimer=setInterval(()=>{console.log('tick');},1000);// 清理函数：防止内存泄漏 + 重复订阅return()=>{clearInterval(timer);};},[]);// 空依赖 → 只在挂载和卸载时执行

加分回答：> “清理函数防止内存泄漏和重复订阅。如果不清理定时器、事件监听或 WebSocket，组件卸载后它们依然存活，造成严重的内存泄漏。”

Q13：React 和 Vue 的核心区别？

核心答题框架：

加分回答：> “React 是UI 库，Vue 是框架。React 更偏‘自由’，Vue 更偏‘约束’——这决定了选型时要看团队偏好和项目复杂度。”

五、框架对比总结（面试加分）

选型决策框架：

“FastAPI for APIs，Django for full-stack，Flask for everything else——然后只在 benchmark 证明你需要时才做优化。”