javascript 设计模式(简单工厂模式)

[wl05]

本系列文章来源于《Javascript设计模式》（张容铭版），做一个记录。

第一种实现方式

我们在创建多个相似类的时候，可以将这些类封装在一个函数中，我们只需要传入相应的参数，告诉这个函数我们需要创建哪个类，然后返回相应的实例。

var LoginAlert = function (text) {
    this.content = text;
}
LoginAlert.prototype.show = function () {
    // 显示警示框
}
// var userNameAlert = new LoginAlert("用户名不能多于16个字母");
// userNameAlert.show();
var LoginConfirm = function (text) {
    this.content = text;
}
LoginConfirm.prototype.show = function () {
    // 显示确认框
}
// var loginFailConfirm = new LoginConfirm("您的用户名不存在，请重新输入");
// userNameAlert.show();
var LoginPrompt = function (text) {
    this.content = text;
}
LoginPrompt.prototype.show = function () {
    // 显示提示框
}
var PopFactory = function (name, text) {
    switch (name) {
        case 'alert':
            return new LoginAlert(text);
        case 'confirm':
            return new LoginConfirm(text);
        case 'prompt':
            return new LoginPrompt(text);
    }
}

在这个demo中我们有LoginAlert、LoginConfirm、LoginPrompt三个类。然后我们声明了一个工厂方法，根据name的值选择执行不同的构造方法并返回相应的实例。

第二种实现方式

同时我们看到LoginAlert、LoginConfirm、LoginPrompt三个类具有相似性，我们也可以用简单工厂模式的方式创建相似对象，当然这些类也有可能有不相似的属性，不相似的针对性处理即可。
所以针对上面的三个类我们也可以用一个工厂方法来实现。

function createPop(type, text) {
    // 创建一个对象，并对对象拓展属性和方法
    var o = new Object();
    o.content = text;
    o.show = function () {
        // 显示方法
    };
    if (type === 'alert') { // 原文这里用的"=="号，我这里改成"==="
        // 警告框差异部分
    }
    if (type === 'prompt') {
        // 提示框差异部分
    }
    if (type === 'confirm') {
        // 确认框差异部分
    }
    // 将对象返回
    return o;
}

// 创建警示框
var userNameAlert = createPop('alert', '用户名只能是26个字母和数字');

两者差异

第一种是通过类实例化对象创建的，第二种是通过创建一个新对象然后包装增强其属性和功能来实现的。差异就是第一种方式种的各个类如果都继承同一个父类，那么父类中的属性是可以共享的。而第二种，每次都是创建一个新的对象，所以他们自身属性之间没有任何联系。（补充： 我认为原文这里说得不是很准确，这里我是用自己话做了总结）