轉載請註明原文地址:www.wistbean.com/uml.html
寫在前面
當你老大扔給你這樣的圖,或者你需要完成某些功能而去看文件的時候發現以下類似這樣的圖會不會不(一)知(臉)所(懵)措(逼):

(圖片來至wikipedia)

(圖片來至微信內網頁支付時序圖)

(圖片來至wikipedia)
如果你看了都不會一臉懵逼,那麼可以出門左轉啦,這篇文章就是來說明這些圖的意思,讓你在工作交流中,或者在看一些文件,或者看我的一些關於設計模式的文章,甚至架構建模中,都能輕鬆理解,毫無壓力!
UML的用例圖
剛剛我們看到的第一張圖片就是用例圖,用例圖有以下幾個東東:
- 用例
- 參與者
- 關聯
- 系統邊界
用例使用橢圓來表示,橢圓裡邊寫上用例的名稱:

參與者用一個小人兒,在小人兒下面寫上參與者名稱,例如學生:

關聯用一條線兒表示:

把用例圍起來,系統邊界就用個矩形啦:

舉個例子:

我們可以看到這個
系統叫做 「購物系統」 ; 有註冊賬號、登入系統、生成訂單的用例(這裡只列舉幾個用例,其它用例省略); 參與者有顧客和管理員; 顧客關聯到了註冊賬號和登入系統的用例; 管理員關聯到了登入系統和生成訂單的用例!
UML的時序圖
時序圖就是我們剛剛看到的第二個圖,時序圖有以下幾個東東:
- 物件
- 生命線
- 活動條
- 訊息
- 控制流
- 順序
- 分支
- 迴圈
物件在矩形裡邊,左邊是物件名稱,右邊是物件型別,下方還有一條線:

用虛線代表的是物件的生命線:

活動條是一個豎著的矩形,當接收到訊息的時候,這個物件就會有活動條:

訊息用一根箭頭,箭頭上面寫上訊息資訊,例如一個登入方法 login(userName,passWord):

控制流有三種,普通就是按順序的一個流程,還有分支就相當於if else:

矩形裡邊有一條虛線,左上角用ALT表示,當C為true的時候,就執行虛線上方的內容,當C為false的時候就執行虛線下方的內容。
迴圈控制流:

左上角有LOOP表示迴圈,當C為true的時候,就迴圈執行方框裡邊的內容!
舉個UML時序圖例子:

可以看到,每個物件都有它們的生命線(虛線);
-
一開始使用者給型別為GUI(介面)的Login物件傳送一個登入資訊 「 login(userName,passWord)」 ;
-
Login這個物件接收到了就會產生活動條,這時候Login這個介面會給型別為Controller的loginController傳送登入資訊「 login(userName,passWord)」 ;
-
此時loginController接收到資訊產生活動條,這時候loginController去找型別為DB的UserDao,給它傳送了一個獲取使用者密碼的資訊 「getUserPassword(userName)」;
-
UserDao接收到資訊後產生活動條,返回使用者的密碼;
-
此時loginController接收到資訊(使用者的密碼 userPassword),loginController此刻將資訊傳送給自己,通過verify去校驗密碼並且用result接收結果;
-
校驗就產生了分支控制流,當resul為true的時候loginController會傳送success給Login,當result為false的時候,loginController會傳送failure給Login;
-
最後Login最後給使用者傳送messag資訊。
好了,當你看到這裡的時候,你就會發現,以後關於這類的時序圖對你來說已經不在話下了。例如本文一開始的第二張圖。
UML的類圖
類圖有以下幾個東東:
- 類名
- 屬性
- 方法
- 可見性
- 資料型別
- 關聯關係
- 依賴關係
- 繼承/實現關係
- 組合/聚合關係
類名、屬性、方法在一個矩形中,分為上中下:

可見性:
- private的時候在前方用 - 表示
- public的時候在前方用 + 表示
- protected的時候在前方用 # 表示
資料型別表示形式:
名字 : 型別
例如:

userName 和 passWord 這兩個屬性是protected修飾的,資料型別都是String; login() 和 register() 這兩個方法是public修飾的,資料型別都是boolean;
關聯關係,用實線表示,例如A關聯B:

依賴關係,用虛線表示,例如A依賴B:

繼承關係,用一個△ + 一條實線表示,例如A繼承B:

依賴關係,用過一個△ + 一條虛線表示,例如A實現B:

組合關係,用一個 ♦ + 一條實線表示,例如A組合B:

聚合關係,用一個 ◇ + 一條實線表示,例如A組合B:

聚合:表示兩個物件之間是整體和部分的弱關係,部分的生命週期可以超越整體。如電腦和滑鼠。
組合:表示兩個物件之間是整體和部分的強關係,部分的生命週期不能超越整體,或者說不能脫離整體而存在。組合關係的“部分”,是不能在整體之間進行共享的。
類圖舉例子:

可以看到,有User類,Customer類,Address類,Role類,Payment類,aliPay類,wechatPay類。
其中Customer 繼承 User,User類的userName 和 passWord 這兩個屬性是protected修飾的,資料型別都是String; login() 和 register() 這兩個方法是public修飾的,資料型別都是boolean;
Address和Role聚合User;
Customer依賴Payment;
aliPay 和 wechatPay 實現了 Payment!
以上,就是關於UML的用例圖,時序圖,類圖!當然可以自己手動畫幾個試試,感覺挺不錯哦,相信你在工作交流中,或者在看一些文件,或者看我的一些關於設計模式的文章,甚至架構建模中,都能輕鬆理解,毫無壓力!