再起航，小弟我的学习笔记之JavaScript设计模式05(简单工厂模式)

再起航，我的学习笔记之JavaScript设计模式05(简单工厂模式)

我的学习笔记是根据我的学习情况来定期更新的，预计2-3天更新一章，主要是给大家分享一下，我所学到的知识，如果有什么错误请在评论中指点出来，我一定虚心接受，那么废话不多说开始我们今天的学习分享吧！

前几次已经和大家分享过了，如何实现javascript的封装继承和多态，这次我们开始正式介绍javascript设计模式。

这次我们要介绍的是创建型设计模式，创建型设计模式是一类处理对象创建的设计模式，通过某种方式控制对象的创建来避免基本对象创建时可能导致设计上的问题或增加设计上的复杂度。

在创建型设计模式中，主要为大家分享的有简单工厂模式，工厂方法模式，抽象工厂模式，建造者模式，原型模式，单例模式。本次主要和大家分享，简单工厂模式。

简单工厂模式

简单工厂模式(Simple Factory): 又叫静态工厂方法，由一个工厂对象决定创建某一种产品对象的实例。主要用来创建同一类对象。

这样说有可能概念很模糊，下面我用示例给大家演示

如果我们要写一组js方法分别要根据不同情况弹出alert(提示框),Confirm(确认框),Prompt(可输入提示框)，我们会怎么做？

就谈谈我吧，要换做以前我会直接调用这3个方法，哪里使用哪里直接调用

function TestAlert(){
     alert("这是一个提示框！");
 }
 function TestConfirm(){
     confirm("这是一个确认框！")
 }
 function TestPrompt(){
     prompt("今天天气怎么样！","");
 }

但是，如果需求更改，我要弹出别的提示，我有可能会再写3个方法

function TestAgainAlert(){
     alert("这又是一个提示框！");
 }
 function TestAgainConfirm(){
     confirm("这又是一个确认框！")
 }
 function TestAgainPrompt(){
     prompt("明天天气怎么样！","");
 }

以前或许觉得没什么就复制粘贴改改就行，但是如果写的多了，有可能方法在哪自己都忘了还要一个个去找，但是有了封装的概念之后，我可能会这么改，我可以把这三个提示框看成3个类，分别是提示类，确认类，可输入提示类

var AlertClass=function(text){
    this.content=text;
 }
AlertClass.prototype.show=function(){
    alert(this.content);
};

我们来看看调用

var TestAlert=new AlertClass("这是一个提示框！");
TestAlert.show();

其他的类同理

//确认类
 var ConfirmClass=function(text){
    this.content=text;
 }
ConfirmClass.prototype.show=function(){
    confirm(this.content);
};
var TestConfirm=new ConfirmClass("这是一个确认框！");
TestConfirm.show();
//可输入提示类
 var PromptClass=function(text){
    this.content=text;
 }
PromptClass.prototype.show=function(){
    prompt(this.content);
};
var TestPrompt=new PromptClass("今天天气怎么样！");
TestPrompt.show();

这样，我们封装成类了之后可以便于管理，但是还是很麻烦因为不同的情况我们需要，实例化不同的对象，这个时候我们可以通过简单工厂模式，去解决这个问题。

我们先定义一个工厂

var EjectFactory=function(name,text){
    switch(name){
        case 'alert':
        return new AlertClass(text);
        case 'confirm':
        return new confirm(text);
        case 'prompt':
        return new PromptClass(text);
    }
}

这样我们就创建了一个工厂，我们试着调用一下。

var TestAgainAlert=EjectFactory('alert','这是一个简单工厂模式创建的提示框！');
TestAgainAlert.show();

是不是看上去很简单，这样我们就可以通过一个工厂去决定我们要去实例化哪个类的实例，简单工厂模式的理念就是创建对象，像我刚才演示就是对不同的类实例化，当然除此之外简单工厂模式还可以用来创建相似的对象。

我们同样用上面的例子，我们可以看到上面的例子同样的都有content属性和show方法，那么我们可以把他们提出来。

var CreateEjectFactory=function(type,text){
    //我们先创建一个对象，并对对象拓展属性和方法
    var o=new Object();
    o.content=text;
    o.show=function(){
        if(type=="alert") alert(text);
        if(type=="confirm") confirm(text);
        if(type=="prompt") prompt(text);
    }
    return o;
}

我们来调用一下

var TestAgainAlert=CreateEjectFactory('alert','这还是一个简单工厂模式创建的提示框！');
TestAgainAlert.show();

我们上述两种简单工厂模式的创建方法，第一种是通过实例化对象创建的，第二种是通过创建一个新对象然后包装其属性和功能来实现的，我们具体的选择还是要根据我们的实际需求来决定。

也谢谢大家看到这里：）如果你觉得我的分享还可以请点击推荐，分享给你的朋友让我们一起进步~

好了以上就是本次分享的全部内容，本次示例参考自JavaScript设计模式一书，让我们一点点积累一点点成长，希望对大家有所帮助。

再起航，小弟我的学习笔记之JavaScript设计模式05(简单工厂模式)

简单工厂模式

相关推荐