UML类图的使用

什么是UML类图

Unified Modeling Language 统一建模语言,UML可以包含很多种图,本系列种使用的是类图

 

画图工具

MS Office visio(比较复杂的类图) 和 processon(本系列种使用这种)

 

创建类图的格式如下

 

画一个简单的UML类图

接下来使用processon来画一个People的类图

根据这个UML类图编写代码

class People {
  constructor (name ,age) {
    this.name = name
    this.age = age
  }
  eat () {
    alert(`${this.name} eat something`)
  }
  speak () {
    alert(`My name is ${this.name}, age:${this.age}`)
  }
}

 

画一个复杂点的UML类图

设计一个比较复杂一点的类,类之间有各种关系的,泛化:表示继承,关联:表示引用

class People {
  constructor (name ,house) {
    this.name = name
    this.age = house
  }
  saySomething () {}
}

class A extends People {
  constructor(name, house){
    super(name, house)
  }
  saySomething () {
    alert('I am A')
  }
}

class B extends People{
  constructor(name, house){
    super(name, house)
  }
  saySomething () {
    alert('I am B')
  }
}

class House {
  constructor(city) {
    this.city = city
  }
  showCity () {
    alert(`house in ${this.city}`)
  }
}
// 测试代码
let aHouse = new House('深圳')
let a = new A('a', aHouse)
console.log(a) // a有房子

let b = new B('b')
console.log(b) // b没有房子

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值