观察者模式+原型链方法实现的一个小案例

题目描述如下:
用JavaScript编写两个类,Restaurant餐馆类和Customer顾客类,要求是:餐馆类的实例拥有name餐厅名字属性和cook做饭方法,cook方法接受一个菜名字符串做参数,弹出“xxx餐厅正在为你做xxx菜”。顾客类的实例拥有enter进入餐厅的方法,接受一个餐厅实例做参数;还拥有order点菜方法,接受一个菜名字符串做参数,可以调用该餐厅的cook方法,会弹出相应信息。

下面是实现的代码,在题目要求的基础上利用昨天学到的观察者模式添加了一个小功能,即当餐馆打烊的时候,所有在餐馆的顾客都要离开。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
//餐馆类
function Restaurant(name) {
this.name = name;
this.customer = [];
};
Restaurant.prototype.cook = function (customer,str) {
alert(this.name + "餐厅正在为"+ customer +"做" + str + "菜");
}
Restaurant.prototype.register = function(customer){
this.customer.push(customer)
}
//餐厅打烊
Restaurant.prototype.dayang = function(){
for(var i = 0;i<this.customer.length;i++){
alert(this.customer[i].name + "走了");
}
}
//顾客
function Customer(name) {
this.name = name;
this.restaurant = null;
}
Customer.prototype.enter = function (restaurant) {
//纪录自己进入的餐厅
this.restaurant = restaurant;
this.restaurant.register(this);
}
Customer.prototype.order = function (str) {
//调用自己进入的餐厅的cook方法
this.restaurant.cook(this.name, str)
}
//实例化餐厅
var maidanglao = new Restaurant("麦当劳");
var kfc = new Restaurant("肯德基");
var qingfegnboazipu = new Restaurant("庆丰包子铺")
var xiaoming = new Customer("小明");
xiaoming.enter(kfc);
xiaoming.order("鸡腿汉堡")
var xiaogang = new Customer("小刚");
xiaogang.enter(kfc);
xiaogang.order("可乐")
var xiaohong = new Customer("小红");
xiaohong.enter(qingfegnboazipu);
xiaohong.order("炒肝");
kfc.dayang();
qingfengbaozipu.dayang();

解析:这道题的难点在于餐厅拥有的cook方法,并不是餐厅在调用,而是用户的order在调用。
用户的enter方法,要纪录下来自己进入哪家餐厅,当用户order的时候,就调用自己进入的这家餐厅的cook方法。

分享到