JavaScript设计模式- 简单工厂模式

Loong_T 发布于2019-08-23 12:08 / 1549人阅读

摘要：简单工厂模式又叫静态工厂方法模式，由一个工厂对象决定创建某一种产品对象类的实例。主要用来创建同一类对象。场景一比如体育商店卖体育器材，里面有很多体育用品，及相关介绍，当我们想买一个篮球及相关介绍时，只需要温售货员，他会帮你找到所有的东西。

简单工厂模式又叫静态工厂方法模式，由一个工厂对象决定创建某一种产品对象类的实例。主要用来创建同一类对象。
场景一：
比如体育商店卖体育器材，里面有很多体育用品，及相关介绍，当我们想买一个篮球及相关介绍时，只需要温售货员，他会帮你找到所有的东西。

//篮球基类
var Baseketball = function () {
    this.intro = "篮球盛行于美国"
}
Baseketball.prototype ={
    getMember:function () {
        console.log("每个队伍需要5名队员");
    },
    getBallSize:function () {
        console.log("篮球很大");
    }
}
//足球基类
var Football = function () {
    this.intro = "足球在世界范围内很流行";
}
Football.prototype = {
    getMember:function () {
        console.log("每个队伍需要11名队员");
    },
    getBallSize:function () {
        console.log("足球很大")
    }
}
//网球基类
var Tennis = function () {
    this.intro = "每年有很多网球系列赛";
}
Tennis.prototype = {
    getMember:function () {
        console.log("每个队伍需要1名队员");
    },
    getBallSize:function () {
        console.log("网球很小");
    }
}
//运动工厂
var SportFactory = function (name) {
    switch (name) {
        case "NBA":return new Baseketball();
        case "wordCup":return new Football();
        case "FrenchOpen":return new Tennis();
    }
}

//为世界杯创造一个足球，只需要记住运动工厂SportsFactory,调用并且创建
var football = SportFactory("wordCup");
console.log(football);
console.log(football.intro);
football.getMember();

场景二：
登录模块和注册模块的需求中有许多提示框，可以利用简单工厂模式，将提示框互相借鉴

var PopFactory = function (name) {
    switch (name) {
        case "alert":return new LoginAlert();
        case "confirm":return new LoginConfirm();
        case "promt":return new LoginPrompt();
    }
}

但是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个字母和数字");

这两种方式创建简单工厂模式有区别，第一种是通过类实例化对象创建的，第二种是创建一个新对象然后包装增强其属性和功能来实现的。

GPU云服务器云服务器代码设计模式工厂模式工厂模式工厂方法模式抽象工厂模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/97973.html

javascript实现简单工厂模式

摘要：从设计模式的分类来看简单工厂模式是创建型模式。使用简单工厂模式将会增加系统中类的个数，在一定程序上增加了系统的复杂度和理解难度。简单工厂模式由于使用了静态工厂方法，造成工厂角色无法形成基于继承的等级结构。简单工厂模式提供了一个接口可以根据传递的参数的不同创建不同的对象，从而将对象自身的逻辑与对象的创建分离开。从设计模式的分类来看简单工厂模式是创建型模式。事实上与简单工厂模式类似的还...

Code4App 2019-08-19 17:18 评论0 收藏0
Javascript设计模式-工厂模式

摘要：设计模式工厂模式最近阅读了几本设计模式方面的书籍学习之余整理下来方便以后的归纳和梳理设计模式工厂模式创造工厂模式是一种创建性模式也就是一种创建对象的最佳实践首先我们需要理解为什么我们需要工厂模式想象一个场景如果你要求去买一些东西板烧鸡腿 Javascript设计模式-工厂模式最近阅读了几本设计模式方面的书籍,学习之余整理下来,方便以后的归纳和梳理设计模式-工厂模式创造工厂模式是一...

feng409 2019-08-22 10:50 评论0 收藏0
JavaScript设计模式系列一：工厂模式

摘要：设计模式共有种，我今天先来了解一下工厂模式，其他的模式将会在后续的博客中陆续为大家讲解。工厂模式主要分为简单工厂模式和抽象工厂模式。抽象工厂模式抽象工厂模式与简单工厂函数不同的是，抽象工厂函数会先设计好接口，具体的实现在子类中进行。设计模式设计模式（design pattern）概念：是一套反复使用、思想成熟、经过分类和无数实战设计经验的总结。是为了代码可重用、可扩展、可解耦、更容...

OldPanda 2019-08-21 18:18 评论0 收藏0
JavaScript工厂模式

摘要：基于工厂角色和产品角色的多态性设计是工厂方法模式的关键。工厂方法模式之所以又被称为多态工厂模式，是因为所有的具体工厂类都具有同一抽象父类。工厂方法模式总结工厂方法模式是简单工厂模式的进一步抽象和推广。 JavaScript工厂模式首先需要说一下工厂模式。工厂模式根据抽象程度的不同分为三种简单工厂模式工厂方法模式抽象工厂模式 1.简单工厂模式简单工厂模式:又称为静态工厂方法...

oujie 2019-08-21 18:33 评论0 收藏0
JavaScript设计模式-工厂方法模式

摘要：工厂方法模式，通过对产品类的抽象使其创建业务，主要负责创建多类产品的实例。安全模式类安全模式类可以屏蔽使用类的错误造成的错误。可以将工厂方法看作是一个实例化对象的工厂类，安全起见，采用安全模式类，将创建对象的基类放在工厂方法类的原型中即可。工厂方法模式，通过对产品类的抽象使其创建业务，主要负责创建多类产品的实例。前面记录了简单工厂模式，但是需求时不断变化的，当需求简单时，直接创建对象...

shixinzhang 2019-08-23 12:09 评论0 收藏0
JavaScript设计模式一：工厂模式和构造器模式

摘要：集中实例化的函数第一个实例第二个实例工厂模式的分类工厂模式分为简单工厂抽象工厂和智能工厂，工厂模式不显示地要求使用一个构造函数。工厂模式之弊大多数类最好使用关键字和构造函数，可以让代码更加简单易读。带原型的构造器中有一个名为的属性。什么是模式前阵子准备期末考试，挺累也挺忙的，实在闲不得空来更新文章，今天和大家说说javascript中的设计模式。首先呢，我们需要知道的是：模式是一...

MkkHou 2019-08-21 10:26 评论0 收藏0