JavaScript进阶：简单工厂模式

1、前言

工厂模式顾名思义是开发者不需要去关注一些基类的实现方式，只需要知道工厂类就行。然后开发者这个工厂类去自行的开发自己需要的对象。这种叫做工厂函数也就是最简单的工厂模式。

这种模式主要应用于数据应用的模块结构类似，比如：注册，登录模块。
测试用例创建两个类，一个打印类，一个运算符操作类，

• 创建一个打印类Print：
  打印类中有属性operator以及函数方法printFun

// 创建一个打印类
const Print = function(num1, num2) {
    this.operator = '打印数据';
    this.printFun = function() {
        return `打印${num1}以及${num2}数据`;
    }
}

• 创建运算符操作类Operate ：
  Operate类中operateFun 方法通过接收操作类型也就是type的值，用来返回不同运算操作的值出去。

// 创建一个运算操作类
const Operate = function(num1, num2) {
    this.operator = '运算符操作';
    this.operateFun = function(type) {
        switch(type) {
            case '+':
                return num1 + num2;
                break;
            case '-':
                return num1 - num2;
                break;
            case '*':
                return num1 * num2;
                break;
            case '/':
                return num1 / num2;
                break;
        }
        
    }
}

• 创建工厂类createFactory ：

// 简单工厂模式
const createFactory = function(name, num1, num2) {
    switch (name){
        case 'print':
            // 返回一个打印类的对象实例
            return new Print(num1, num2);
            break;
        case 'operate':
            // 返回一个运算类的对象实例
            return new Operate(num1, num2);
            break;
        default:
            break;
    }
}

这个工厂类都是对传入的num1和num2两个数据进行不同逻辑的处理

• 使用prototype原型链去拓展自行需要的方法：
  原本的打印类只是单纯的打印出来了数据，现在我的需求是想通过弹出层弹出数据，就可以通过如下代码实现。

// 拓展
Print.prototype.alertFun = function(num1, num2) {
    alert(`弹出${num1}、${num2}数据！`)
}

• 创建工厂模式中的基类实例对象：

// 开始使用
const obj1 = new createFactory('print', 10, 3);
const printMsg = obj1.printFun();
obj1.alertFun(1, 2);
console.log(printMsg);

const obj2 = new createFactory('operate', 15, 4);
const result = obj2.operateFun('*');
console.log(result);

图1.png
图2.png