美文网首页
创建者模式

创建者模式

作者: _贺瑞丰 | 来源:发表于2018-06-23 10:29 被阅读2次

    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()
        }
    }
    

    相关文章

      网友评论

          本文标题:创建者模式

          本文链接:https://www.haomeiwen.com/subject/eceqyftx.html