设计模式

设计模式

[TOC]

1、简单工厂模式

通过实例化对象创建

var Popfactory = function (name) {
    switch(name){
        case 'alert':
            return new LoginAlert();
        case 'confirm':
            return new LoginConfirm();
        case 'Prompt':
            return new LoginPrompt();
    }
}   

但是三个方法的重合属性比较高的时候,

通过创建一个新的对象然后包装,增强其属性和功能来实现


function createPop(type,text){
    var o = new Object();
    o.content = text;
    o.show = function(){
        //公共的代码
    };
    if(type =='alert'){
        //这里添加弹出框的具体实现方式
    }
    if (type == 'propt') {
        //这里添加输入框的具体实现方式

    }
    if (type == 'confirm') {
        //这里添加确认框的具体实现方式
    }
    return o;
}
var userNameALert = createPop('alert','用户名只能是26个字母和数字');

2、工厂方法模式

将实际创建的对象工作推迟到子类当中。这样核心类就成了抽象类

安全模式类

安全类模式类屏蔽使用者对类的错误使用照成的错误,比如Demo类,我们必须要new Demo才可以,但是,为了防止人var d = Demo();这种操作带来的错误,我们需要兼容


var Demo = function (){
}
Demo.prototype = {
    show:function(){
        console.log('成功获取');
    },
}
var d = new Demo();
d.show();

var e = Demo();
e.show();//TypeError: undefined is not an object (evaluating 'e.show')

如上,这个时候就会报错,所以我们需要这样写Demo

var Demo = function (){
    if(!(this instanceof Demo)){
        return new Demo();
    }
}

安全的工厂方法

  1. 使用了安全模式类
  2. 工厂方法中,主方法通过type content灵活调用,不用switch,或者是if这样就能直接使用而不用在构造方法里也进行添加

var Factory = function(type,content){
    if(this instanceof Factory){
        var s = new this[type](content);
        return s;
    }
    else{
        return new Factory(type,content);
    }
}
Factory.prototype = {
    java:function(content){},
    javascript:function(content){},
    //...
}

3、抽象工厂模式

抽象工厂方法:

抽象类方法就是一个实现子类继承父类的方法,


//抽象工厂方法
var VehicleFactory = function(subType,superType){
    //判断抽象工厂中是否有这个抽象类
    if(typeof vehicleFactory[subType] == 'function'){
        // 缓存
        function F(){};
        F.prototype = new vehicleFactory[subType]();
        subType.constructor = subType;
        subType.prototype = new F();
    }else{
        throw new Error("未创建该抽象类");
    }
}

//小汽车的抽象方法
VehicleFactory.Car = function(){
    this.type = "car";
}
VehicleFactory.Car.prototype = {
    getPrice:function(){
        throw new Error("抽象方法不能调用");
    },
    getSpeed:function(){
        throw new Error("抽象方法不能调用")
    }
}

//公共车的抽象方法
VehicleFactory.Bus = function () {
    this.type = "Bus";
}
VehicleFactory.Bus.prototype = {
    getPrice: function () {
        throw new Error("抽象方法不能调用");
    },
    getSpeed: function () {
        throw new Error("抽象方法不能调用")
    }
}

抽象类的实现


//使用的方法:
var BMW = function(price,speed){
    this.price =  price;
    this.speed = speed;
}
VehicleFactory(BMW,"Car");
BMW.prototype.getPrice = function(){
    return this.price;
}
BWM.prototype.getSpeed = function(){
    return this.getSpeed;
}

//调用的时候
var car = new BMW("1000",10);
console.log(car.getPrice());
console.log(car.getSpeed());

4、建造者模式

工厂模式我们得到的都是对象实例或者是类簇,建造者模式目的也是为了创建对象,但是更多的是关心创建这个对象的过程,甚至创建对象的每一个细节

我的理解:就是将每个属性封装成一个类


//创建一个人的类
var Human = function(param){
    this.skill = param && param.skill ||"保密";
    this.hobby = param && param.hobby ||"保密";
}
Human.prototype = {
    getSkill : function(){
        return this.skill;
    },
    getHobby = function(){
        return this.hobby;
    }
}
//名字的类
var Named = function(name){
    var that = this;
    (function(name,that){
        that.wolename = name;
        if(name.indexOf(" ") > -1){
            that.firstName = name.slice(0,name.indexOf(" "));
            that.secondName = name.slice(name.indexOf(" "));
        }
    }(name,that))
}
//工作的类
var Work = function(work){
    var that = this;
    (function(work,that){
        switch(work){
            case "code":
                that.work = "工程师";
                that.workDescirpt = "编程";
                break;
            case "teacher":
                that.work = "老师";
                that.workDescirpt = "分享";
                break;
            case "UE":
                that.work = "设计师";
                that.workDescirpt = "设计";
                break;
            default :
                that.work = work;
                that.workDescirpt = "不知道你干嘛的";
        }
    }(work,that))
}
Work.prototype.changeWork = function(work){
    this.work = work;
}
Work.prototype.changeWorkDescirpt = function (workDescirpt) {
    this.workDescirpt = workDescirpt;
}







//创建应聘者,这个人创建一些属性,包括工作,名字之类的
var Persion = function(name,work){
    var _Persion = new Human();
    _Persion.work = new Worker(work);
    _Persion.name = new Named(name);
    return _Persion;
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值