传统时序图概念中参与者有角色和类对象之分,但这里我们不做此区分,用参与者表示一切参与交互的事物,可以是人、类对象、系统等形式。中间竖直的线段从上至下表示时间的流逝。
画法:
sequenceDiagram
participant 客户端
participant 服务器
sequenceDiagram为每幅时序图的固定开头
participant <参与者名称>声明(添加)参与者。语句次序即为参与者横向排列的次序,如后续示例所示。
交互时一方对另一方的操作(比如接口调用)或传递出的信息。用单向箭头来表示——实线代表主动发出消息;虚线代表响应;末尾带「X」代表异步消息,无需等待回应。
画法:
sequenceDiagram
participant 老板L
participant 员工A
老板L ->> 员工A : “在这里我们是兄弟!”
老板L -x 员工A : 画个饼
员工A -->> 老板L : 怯怯地鼓掌
消息语句格式为:
<参与者> <箭头> <参与者> : <描述文本>。其中
<箭头>的写法有:
->>:显示为实线箭头(主动发出消息)-->>:显示为虚线箭头(响应)-x:显示为末尾带「X」的实线箭头(异步消息)
注:
participant <参与者名称>这句其实可以省略,省略后参与者横向排列的次序,由消息语句中参与者出现的次序决定。如后续示例所示。
从消息接收方的时间线上标记一小段时间,表示对消息进行处理的时间间隔。
画法如下,注意体会箭头符号后的 + 和 - 的使用方法和效果,它们相当于激活框的开关:
sequenceDiagram
老板M ->> + 员工B : “不仅996,还要669!”
员工B -->> - 老板M : 怯怯地鼓掌
老板M ->> + 员工B : “悔创本司!”
员工B -->> - 老板M : 怯怯地鼓掌
画法:
sequenceDiagram
Note left of 老板L : 对脸不感兴趣
Note right of 老板M : 对钱不感兴趣
Note over 老板L,老板M : 对996感兴趣
在条件满足时,重复发出消息序列。(相当于编程语言中的 while 语句。)
画法:
sequenceDiagram
网友 ->> + X宝 : 网购钟意的商品
X宝 -->> - 网友 : 下单成功
loop 一天七次
网友 ->> + X宝 : 查看配送进度
X宝 -->> - 网友 : 配送中
end
在多个条件中作出判断,每个条件将对应不同的消息序列。(相当于 if 及 else if 语句。)
画法:
sequenceDiagram
土豪 ->> 取款机 : 查询余额
取款机 -->> 土豪 : 余额
alt 余额 > 5000
土豪 ->> 取款机 : 取上限值 5000 块
else 100 < 余额 < 5000
土豪 ->> 取款机 : 有多少取多少
else 余额 < 100
土豪 ->> 取款机 : 退卡
end
取款机 -->> 土豪 : 退卡
在某条件满足时执行消息序列,否则不执行。相当于单个分支的 if 语句。
sequenceDiagram
老板们 ->> 员工们 : 开始实行996
opt 永不可能
员工们 -->> 老板们 : 拒绝
end
将消息序列分成多个片段,这些片段并行执行。
画法:
sequenceDiagram
老板C ->> 员工C : 开始实行996
par 并行
员工C ->> 员工C : 刷微博
and
员工C ->> 员工C : 工作
and
员工C ->> 员工C : 刷朋友圈
end
员工C -->> 老板C : 9点下班
用代码画时序图的方法就是这些,内容很简单,却能满足大多数时候的需求。不妨找几个实际例子练练手,加深下印象。
相关阅读:











