创建型
- 工厂模式 ( 工厂方法模式, 抽象工厂模式, 建造者模式 )
- 单例模式
- 原型模式
结构型
- 适配器模式
- 装饰器模式
- 代理模式
- 外观模式
- 桥接模式
- 组合模式
- 享元模式
行为型
- 策略模式
- 模板方法模式
- 观察者模式
- 迭代器模式
- 职责连模式
- 命令模式
- 备忘录模式
- 状态模式
- 访问者模式
- 中介者模式
- 解释器模式
例题
- 打车
- 打车时, 可以打专车或者快车. 任何车都有车牌号和名称.
- 不同车价格不同, 快车每公里 1 元, 专车每公里 2 元
- 行程开始时, 显示车辆信息
- 行程结束时, 显示打车金额 ( 假定行程就 5 公里 )
问题
- 画出 UML 类图
- 用 ES6 语法写出该示例
解答

class Car {
constructor(number, name) {
this.number = number;
this.name = name;
}
}
class Kuaiche extends Car {
constructor(number, name) {
super(number, name);
this.price = 2;
}
}
class Manche extends Car {
constructor(number, name) {
super(number, name);
this.price = 1;
}
}
class Trip {
constructor(car) {
this.car = car;
}
start() {
console.log(`行程开始, 名称: ${this.car.name}, 车牌号: ${this.car.number}`);
}
end() {
console.log(`行程结束, 价格: ${this.car.price * 5}`);
}
}
const car = new Kuaiche(100, "桑塔纳");
const trip = new Trip(car);
trip.start();
trip.end();
- 停车
- 某停车场, 分三层, 每层 100 车位
- 每个车位都能监控到车辆的驶入和离开
- 车辆进入前, 显示每层的空余车位数量
- 车位进入时, 摄像头可识别车牌号和时间
- 车辆出来时, 出口显示器显示车牌号和停车时长
问题
- 画出 UML 类图
解答

// 车
class Car {
constructor(num) {
this.num = num;
}
}
// 摄像头
class Camera {
shot(car) {
return {
num: car.num,
inTime: Date.now()
};
}
}
// 出口显示器
class Screen {
show(car, inTime) {
console.log("车牌号", car.num);
console.log("停车时间", Date.now() - inTime);
}
}
// 停车场
class Park {
constructor(floors = []) {
this.floors = floors;
this.camera = new Camera();
this.screen = new Screen();
this.carList = {}; // 存储摄像头拍摄返回的车辆信息
}
in(car) {
// 通过摄像头获取信息
const info = this.camera.shot(car);
// 停到某个停车位
const i = parseInt((Math.random() * 100) % 100);
const place = this.floors[0].places[i];
place.in();
info.place = place;
// 记录信息
this.carList[car.num] = info;
}
out(car) {
// 获取信息
const info = this.carList[car.num];
// 将停车位清空
const place = info.place;
place.out();
// 显示时间
this.screen.show(car, info.inTime);
delete this.carList[car.num];
}
emptyNum() {
return this.floors
.map(floor => {
return `${floor.index} 层, 还有${floor.emptyPlaceNum()} 个空闲车位`;
})
.join("\n");
}
}
// 层
class Floor {
constructor(index, places = []) {
this.index = index;
this.places = places;
}
emptyPlaceNum() {
let num = 0;
this.places.forEach(p => {
if (p.empty === true) num++;
});
return num;
}
}
// 车位
class Place {
constructor() {
this.empty = true;
}
in() {
this.empty = false;
}
out() {
this.empty = true;
}
}
// 测试
// 初始化停车场
const floors = [];
for (let i = 0; i < 3; i++) {
const places = [];
for (let j = 0; j < 100; j++) {
places[j] = new Place();
}
floors[i] = new Floor(i + 1, places);
}
const park = new Park(floors);
// 初始化车辆
const car1 = new Car(100);
const car2 = new Car(200);
const car3 = new Car(300);
console.log("第一辆车进入");
console.log(park.emptyNum());
park.in(car1);
console.log("第二辆车进入");
console.log(park.emptyNum());
park.in(car2);
console.log("第一辆车离开");
park.out(car1);
console.log("第二辆车离开");
park.out(car2);
console.log("第三辆车进入");
console.log(park.emptyNum());
park.in(car3);
console.log("第三辆车离开");
park.out(car3);
网友评论