前端设计模式应用--工厂模式

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第1天

背景

模式和软件模式的概念：

• 模式是在特定环境下人们解决某类重复出现问题的一套成功或有效的解决方案。
  A pattern is a successful or efficient solution to a recurring problem within a context
• 软件模式是在软件开发过程中为一些重复出现的问题提供的合理、有效的解决方案。

      设计模式是在软件开发过程中为一些重复出现的软件设计问题提供的合理、有效的解决方案。设计模式更多的是指导思想和方法论，而不是现成的代码，当然每种设计模式都有每种语言中的具体实现方式。

工厂模式

介绍

• 工厂模式（Factory Pattern）是 软件工程中最常用的设计模式之一。这种类型的设计模式属于创建型模式，它提供了一种创建对象的最佳方式。

  在工厂模式中，我们在创建对象时不会对客户端暴露创建逻辑，并且是通过使用一个共同的接口来指向新创建的对象。

实现与应用

简单工厂模式

      简单工厂模式是属于创建型模式，又叫做静态工厂方法（Static Factory Method）模式。简单工厂模式最大的优点在于实现对象的创建和对象的使用分离。

示例：

class Circle { // 圆类
    constructor(name) { console.log('我的名字叫：'+ name) }
}

class Square { // 正方形
    constructor(name) { console.log(name) }
}

class Rectangle { // 长方形
    constructor(name) { console.log(name) }
}

要画不同的图形，只需要使用对应的类去创建相对应的对象即可：

//画圆型 -- 小圆
new Circle('小圆')

//画方形 -- 小方new Square('小方')

//画长方形 -- 小长
new Rectangle('小长')

这种方式存在很大的问题，从面向对象来讲，他们属于一类对象，每次新增一个都需要去创建一个类，有没有更好的方式去实现呢？当然有，就是简单工厂模式

class Circle { // 圆类
    constructor(name) {
        console.log('我的名字叫：' + name)
    }
}

class Square { // 正方形
    constructor(name) {
        console.log('我的名字叫：' + name)
    }
}

class Rectangle { // 长方形
    constructor(name) {
        console.log('我的名字叫：' + name)
    }
}

class ShapeFactory {
    constructor(name, type) {
        switch (type) {
            case 'circle':
                return new Circle(name);
            case 'square':
                return new Square(name);
            case 'rectangle':
                return new Rectangle(name)
        }
    }
}

//去画画
new ShapeFactory('小圆'，'circle')
new ShapeFactory('小方'，'square')new ShapeFactory('小长'，'rectangle')

工厂方法模式

• 工厂方法模式（FACTORY METHOD）是一种常用的类创建型设计模式,此模式的核心精神是封装类中变化的部分，提取其中个性化善变的部分为独立类，通过依赖注入以达到解耦、复用和方便后期维护拓展的目的。它的核心结构有四个角色，分别是抽象工厂；具体工厂；抽象产品；具体产品

class Circle { // 圆类
    constructor(name) {
        console.log('我的名字叫：' + name)
    }
}

class Square { // 正方形
    constructor(name) {
        console.log('我的名字叫：' + name)
    }
}

class Rectangle { // 长方形
    constructor(name) {
        console.log('我的名字叫：' + name)
    }
}

// 形象工厂（创建者类）
abstract class ShapeFactory {
    public abstract createShape(type: string): Shape;
}

class CreateShapeFactory extends Creator {
    constructor() {
        super();
    }
    public createShape(type: string): Shape {
        let shape = null;
        switch (type) {
            case 'circle':
                return new Circle(name);
            case 'square':
                return new Square(name);
            case 'rectangle':
                return new Rectangle(name)
        }
        return shape;
    }
}

//去画画
const shapeItem = new CreateShapeFactory()
//画圆
const circle = shapeItem.createShape('circle')
//画方
const circle = shapeItem.createShape('square')

抽象工厂模式

• 抽象工厂模式（Abstract Factory Pattern）隶属于设计模式中的创建型模式，用于产品族的构建。抽象工厂是所有形态的工厂模式中最为抽象和最具一般性的一种形态。抽象工厂是指当有多个抽象角色时使用的一种工厂模式。抽象工厂模式可以向客户端提供一个接口，使客户端在不必指定产品的具体情况下，创建多个产品族中的产品对象

抽象工厂模式（Abstract Factory Pattern）是围绕一个超级工厂创建其他工厂。该超级工厂又称为其他工厂的工厂。

// 抽象形状类
abstract class Shape {
    name: string;
    type: string;

    constructor(name: string, type: string) {
        this.name = name;
        this.type = type;
    }

    abstract getShape(): string;
}

// 抽象颜色类
abstract class Color {
    colorValue: string;

    constructor(name: string) {
        this.colorValue = colorValue;
    }

    // 设置颜色
    abstract setColor(colorValue: string): void;
}


class CircleShape extends Shape {
    getShape() {
        return 'circle'
    }
}

class RedColor extends Color {
    setColor(colorValue: string) {
        console.log(`我是红色`);
    }
    getColor() {
        return 'red'
    }
}

class Canvas {
    getShare(name) {
        return new CircleShape('circle')
    }
    getColor() {
        return new RedColor('red')
    }
}

汇总

• 工厂创建型模式亦称虚拟构造函数、Virtual Constructor、Factory Method

• 工厂方法将创建产品的代码与实际使用产品的代码分离， 从而能在不影响其他代码的情况下扩展产品创建部分代码

• 简单工厂适用工厂类负责创建的对象比较少；客户端只知道传入工厂类的参数，对于如何创建对象不关心。

• 工厂方法模式适用一个类不知道它所需要的对象的类；一个类通过其子类来指定创建哪个对象。

• 抽象工厂模式适用一个系统不应当依赖于产品类实例如何被创建、组合和表达的细节；系统中有多于一个的产品族，而每次只使用其中某一产品族；属于同一个产品族的产品将在一起使用；系统提供一个产品类的库，所有的产品以同样的接口出现，从而使客户端不依赖于具体实现。