一分钟了解什么是时序图,并学会用mermaid绘制时序图

💡什么是时序图?

时序图(Sequence Diagram)是UML(统一建模语言)中的一种交互图,用于按时间顺序展示对象/组件之间如何通过消息进行协作。

时序图的核心元素包括:

  • 生命线(Lifeline):代表参与交互的对象(或角色、组件、服务),用带有名字的矩形和向下延伸的虚线表示。
  • 激活条(Activation Bar):表示对象正在执行操作的时间段。
  • 消息(Message):对象之间传递的调用、返回、创建、销毁等信号,用箭头表示。
  • 交互片段(Combined Fragment):如alt(条件分支)、loop(循环)、par(并行)等,用于描述复杂的控制流。

时序图强调时间顺序------越靠近图上方的事件发生越早,越靠近下方则越晚。

🧩来看一个用户登录流程时序图示例

以下是一个时序图示例,该示例完整的演示了一个用户登录的流程:

  • 用户(User)通过前端(WebFrontend)界面`输入用户名和密码`。
  • 前端用POST调用`/login`接口请求认证服务(AuthService)。
  • 认证服务`查询用户信息`访问数据库(DB),数据库返回用户记录。
  • 认证服务验证密码并返回结果。

🪂Mermaid 绘制时序图代码

Mermaid 是一种轻量级的图表描述语言,可直接嵌入 Markdown 文档中。以下是用户登录流程示例的mermaid时序图代码:

大多数 Markdown 编辑器如 #WordBN、GitHub、Obsidian 都支持渲染 Mermaid。

🚀Mermaid 时序图语法要点:

元素 写法示例 说明
参与者 participant 别名 as 显示名 定义生命线
同步消息 A->>B: 消息内容 实线箭头
返回消息 A-->>B: 返回值 虚线箭头
自调用 A->>A: 方法名 指向自身
激活/去激活 activate A/deactivate A 控制激活条(也可用+/-简写)
条件分支 alt ... else ... end 表示选择逻辑
循环 loop 描述 ... end 表示重复执行
并行 par ... end 表示并发执行

🛠️时序图的使用场景

时序图常用于以下场景:

  1. 系统需求分析

    • 描述用户与系统之间的交互流程(例如:登录、下单)。
    • 用例的详细展开,展示参与对象如何协作完成一个功能。
  2. 详细设计与架构文档

    • 说明微服务/模块间的接口调用顺序。
    • 展示异步消息、回调、事件驱动的交互流程。
  3. 调试与理解现有系统

    • 反向梳理复杂的调用链,帮助新成员理解代码逻辑。
  4. 协议与接口设计

    • 规范 REST API / RPC 的调用顺序和数据流向。
  5. 编写技术方案/评审

    • 用可视化方式降低沟通成本,避免纯文字歧义。

🔚🔸🔸🔸

🧑‍💻我是 #WordBN字远笔记软件 #C++应用服务器MYCP 等免费软件和开源项目作者。

📌关注我,一起来学一些实用的编程知识和技术。

相关推荐
智码看视界1 天前
Day68-结构化Prompt设计:XML标签法/Markdown法/JSON Schema
prompt·markdown·json schema·spring ai·结构化prompt·xml标签
一马平川的大草原2 天前
如何实现SVG转Mermaid图
python·svg·格式转换·mermaid
不想学算法了6 天前
markdown格式常用命令
markdown
E_ICEBLUE11 天前
Python 实现 Markdown 转 Word、PDF:从转换到页面设置
python·pdf·word·markdown·格式转换
G_G#14 天前
一款主打本地离线的Windows Markdown编辑器 MD.E,支持AI智能体与定时自动化
markdown·md格式·专用编辑器·免费markdown编辑工具
kisshyshy14 天前
掘金同款社区数据库设计:9张表带你吃透建表、索引与约束
后端·sql·markdown
用户2986985301414 天前
Markdown 转 PDF 免费在线攻略:简单几步轻松搞定
人工智能·后端·markdown
Simon_He15 天前
一个渲染内核,五个框架包:我的流式 Markdown 渲染库是怎么长成“全家桶”的
前端·vue.js·markdown
嘟嘟071715 天前
一个微信公众号 Markdown 渲染组件,如何用 SDD 把需求、架构、任务一次写清
react.js·markdown
北漂燕郊杨哥16 天前
DotMD:一款基于 Go + Wails 的轻量开源 Markdown 桌面编辑器
golang·开源·编辑器·markdown·md