1.工厂模式
给登录模块做一些基础功能
-
需求1:登录模块名称不符合要求的警示框
-
需求2:密码也要这样的警示框
-
需求3:注册确认按钮
-
需求4:登录成功提示框prompt
-
实现思路
登录模块由很多个小模块组成,每个小模块封装一个基类。
上面我们需要封装 loginAlert类,Loginconfirm类,LoginPrompt类
代码实现
//封装一个LoginAlert类,提供弹出框功能
var LoginAlert = function (text) {
this.content = text
}
LoginAlert.prototype.show = function () {
alert(this.content)
}
//实例化
var userNameAlert = new LoginAlert('用户名不能超过16个字')
//需要弹窗,则调用实例的show方法
userNameAlert.show()
var passWordAlert = new LoginAlert('输入的密码不正确')
passWordAlert.show()
var Loginconfirm = function(){
this.content = text;
}
Loginconfirm.prototype.show = function(){
//显示确认框
}
var loginFailconfirm = new Loginconfirm('你的用户名不存在')
loginFailconfirm.show()
var LoginPromt = function (text) {
this.content = text
}
LoginPromt.prototype.show = function () {
//显示提示框
}
如何调用
当用户交互时,监听交互,在事件回调用需要弹窗就实例化一个对象,并调用show(),上述代码的问题是,提供了三个类,调用人员需要记得东西太多了
改进:使用simple factory 模式
思路:提供一个工厂类,接收参数,自动判断来生成什么实例
优点:使用人员只需要记住简单参数,通过工厂中介
缺点:工厂责任重。。。。。
var PopFactory = function(name){
switch (name){
case 'alert':
return new LoginAlert()
case 'confirm':
return new Loginconfirm()
case 'prompt':
return new LoginPromt()
}
}
网友评论