【JS设计模式3】UML类图

UML类图

UML类图一些相关

UML类图的画图工具

• MS Office visio
• https://www.processon.com/

类图

类图模板

拿到一个类，然后画一个"一列三行"的表格;
第一行是写类名
第二行是所有的属性
第三行是所有的方法
+表示 public # 表示 protected - 表示 private
属性：符号之后空格，属性名加冒号，然后写明是什么类型(布尔，数字，字符串等)的。
方法：符号之后也要空格，方法名以及参数，然后是返回值的类型

举个栗子

这个people类

这个类对应的UML图如下：

我是对应的UML图

void表示无返回值，写 undefined也行

关系

• 泛化，表示继承
• 关联，表示引用

比如这样一个关系

A和B都继承自People，但是People关联了house

实例

对应的UML图

【PS】在 people的类图中， house的类型是 House构造函数类型，空箭头表示继承，实心箭头表示引用。