Mermaidクラス図 — オブジェクト指向設計

Mermaidでクラス図を作成します。クラス、属性、メソッド、可視性修飾子、継承やコンポジションなどの関係性の定義方法を学びます。

Diagram Types

詳細な説明

Mermaidのクラス図

クラス図はオブジェクト指向システムの構造を視覚化するUML標準です。クラス、その属性とメソッド、およびクラス間の関係を示します。MermaidはUMLクラス図表記のサブセットを実装しており、実用的なユースケースのほとんどをカバーしています。

クラスの定義

クラスは名前の後に波括弧内で属性とメソッドを定義します:

classDiagram
    class Animal {
        +String name
        +int age
        +makeSound() void
        +move(distance: int) void
    }

可視性修飾子

Mermaidは標準的なUML可視性プレフィックスを使用します:

記号 意味
+ Public(公開)
- Private(非公開)
# Protected(保護)
~ Package / Internal(パッケージ)

関係性

クラス間の関係は異なる矢印記法で描画されます:

classDiagram
    Animal <|-- Dog : inherits
    Animal <|-- Cat : inherits
    Dog *-- Leg : composition
    Dog o-- Toy : aggregation
    Dog --> Collar : association
    Dog ..> Food : dependency
構文 関係性
<|-- 継承
*-- コンポジション(強い所有)
o-- 集約(弱い所有)
--> 関連
..> 依存
..|> 実現 / implements

多重度

関係にカーディナリティラベルを追加します:

classDiagram
    Customer "1" --> "*" Order : places
    Order "1" *-- "1..*" OrderItem : contains
    OrderItem "*" --> "1" Product : references

完全な例

classDiagram
    class Shape {
        <<abstract>>
        +float area()
        +float perimeter()
    }
    class Circle {
        -float radius
        +Circle(radius: float)
        +float area()
        +float perimeter()
    }
    class Rectangle {
        -float width
        -float height
        +Rectangle(w: float, h: float)
        +float area()
        +float perimeter()
    }
    Shape <|-- Circle
    Shape <|-- Rectangle

<<abstract>>アノテーションはShapeを抽象クラスとしてマークし、直接インスタンス化できないことを明確に伝えます。

ユースケース

コンテンツ管理プラットフォームのプラグインシステムを設計するソフトウェアアーキテクトのケース。クラス図がベースのPluginインターフェース、具体的なプラグイン実装、PluginManagerによるプラグイン集約を示し、開発チームの設計図として機能します。

試してみる — Mermaid Diagram Editor

フルツールを開く